33 lines
1.1 KiB
JavaScript
33 lines
1.1 KiB
JavaScript
import React, { Component } from 'react';
|
|
import { CKEditor } from '@ckeditor/ckeditor5-react';
|
|
import ClassicEditor from '@ckeditor/ckeditor5-build-classic';
|
|
|
|
const TextEditor = ({data, setData}) => {
|
|
return (
|
|
<div className="App">
|
|
<h2>Редактор статьи</h2>
|
|
<CKEditor
|
|
editor={ ClassicEditor }
|
|
data={data}
|
|
config = {{
|
|
mediaEmbed: {previewsInData: true }
|
|
}}
|
|
onReady={ editor => {
|
|
// You can store the "editor" and use when it is needed.
|
|
console.log( 'Editor is ready to use!', editor );
|
|
} }
|
|
onChange={ ( event, editor ) => {
|
|
setData(editor.getData())
|
|
}}
|
|
onBlur={ ( event, editor ) => {
|
|
console.log( 'Blur.', editor );
|
|
} }
|
|
onFocus={ ( event, editor ) => {
|
|
console.log( 'Focus.', editor );
|
|
} }
|
|
/>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export default TextEditor; |