Breaking News: Grepper is joining You.com. Read the official announcement!

install ckeditor 5 for react js

Manav Sarkar answered on March 12, 2022 Popularity 10/10 Helpfulness 5/10

answer install ckeditor 5 for react js

install ckeditor 5 for react js

Comment

npm install --save @ckeditor/ckeditor5-react @ckeditor/ckeditor5-build-classic

import React, { Component } from 'react';
import { CKEditor } from '@ckeditor/ckeditor5-react';
import ClassicEditor from '@ckeditor/ckeditor5-build-classic';

class App extends Component {
    render() {
        return (
            <div className="App">
                <h2>Using CKEditor 5 build in React</h2>
                <CKEditor
                    editor={ ClassicEditor }
                    data="<p>Hello from CKEditor 5!</p>"
                    onReady={ editor => {
                        // You can store the "editor" and use when it is needed.
                        console.log( 'Editor is ready to use!', editor );
                    } }
                    onChange={ ( event, editor ) => {
                        const data = editor.getData();
                        console.log( { event, editor, data } );
                    } }
                    onBlur={ ( event, editor ) => {
                        console.log( 'Blur.', editor );
                    } }
                    onFocus={ ( event, editor ) => {
                        console.log( 'Focus.', editor );
                    } }
                />
            </div>
        );
    }
}

export default App;

Popularity 10/10 Helpfulness 5/10 Language javascript

Source: ckeditor.com

Tags: ckeditor javascript

Link to this answer
Share Copy Link

Contributed on Mar 12 2022

Manav Sarkar

0 Answers Avg Quality 2/10

install ckeditor 5 for react js

Contents

More Related Answers

install ckeditor 5 for react js

Grepper

Documentation

Social

Legal

Contact

Oops, You will need to install Grepper and log-in to perform this action.