setData при нажатии кнопки для CKEditor 5 в React

Question

Я использую CKEditor 5 в качестве текстового редактора в приложении React. У меня есть кнопка на странице, которая при нажатии вставит текст «Кнопка была нажата» внутри CkEditor. Как я могу достичь этого? Я знаю, что у CKEditor есть метод setData, но как мой клик кнопки сможет даже получить доступ к CKEditor?

Мой ckeditor

<CKEditor editor={ClassicEditor} />

Моя кнопка

<Button onClick={this.handleClick}>Click Me</Button>

handleClick

handleClick = e => { /* setData in the editor */ };

Answer 1

Шаг 1:

Перед обработкой щелчка в объявлении ckEditor необходимо обработать метод onInit.

В методе onInit CkEditor предоставит вам экземпляр редактора. Вам нужно сохранить этот экземпляр в локальной переменной.

Шаг 2: щелкнув по внутренней ручке, вы можете использовать это:

 editor.model.change(writer => {
            writer.insertText("Button was clicked", editor.model.document.selection.getFirstPosition());
        });