Добавление сущности в свой блок в DraftJS - PullRequest
Новая
       23

Добавление сущности в свой блок в DraftJS

0 голосов
/ 01 сентября 2018

Итак, я пытаюсь создать довольно простой редактор WYSIWYG BBCode для моего проекта, чтобы представить себе DraftJS. Я следовал некоторым урокам, а также использовал response-rte в качестве примера (поскольку он обладает 99% необходимой мне функциональности и выглядит относительно простым для понимания).

Проблема, с которой я столкнулся, заключается в том, что react-rte вставляет сущности изображения встроенными (это добавляет пробел в текущем выделении, а затем связывает запись с этим пробелом) следующим образом: 

const addEntity = (editorState, type, mutability = 'MUTABLE', data = {}) => {
    let currentContent = editorState.getCurrentContent();
    let selection = editorState.getSelection();
    currentContent = currentContent.createEntity(type, mutability, data);
    let entityKey = currentContent.getLastCreatedEntityKey();
    return Modifier.insertText(currentContent, selection, ' ', null, entityKey);
}

Я хочу, чтобы каждое изображение (и видео) было в своем отдельном блоке, и чтобы оно больше ничего не могло быть записано в этот блок. Я нашел пример поведения, за которым я следую, в megadraft , но я не смог пройтись по его коду, чтобы найти правильную реализацию.

1 Ответ

0 голосов
/ 03 сентября 2018

Нашел решение после многих часов проб и ошибок (и множества руководств). 

const addAtomic = (editorState, type, mutability = 'MUTABLE', data = {}) => {
    let currentContent = editorState.getCurrentContent();
    let selection = editorState.getSelection();
    currentContent = currentContent.createEntity(type, mutability, data);
    let entityKey = currentContent.getLastCreatedEntityKey();
    const newState = EditorState.set(editorState, { currentContent: currentContent })
    return AtomicBlockUtils.insertAtomicBlock(newState, entityKey, ' ')
}
...