如何在draftjs中更改ContentBlock渲染的顺序？

Question

对于js草案有疑问。

我如何更改ContentBlocks的订单？我试图在内容中添加外部链接并在编辑器中呈现视频。

创建当前状态：

createEditorState(source) {
        if (!source) {
          return EditorState.createEmpty();
        }

        const contentState = stateFromMarkdown(source);
        const editorState = EditorState.createWithContent(contentState);

        return addVideoContent(source, editorState)
 }

添加带视频内容的块（支持通过视频插件呈现）：

addVideoContent(source, editorState) {
    function buildNewEditorState(state, src) {
      const currentContentState = state.getCurrentContent();
      const contentStateWithEntity = currentContentState
        .createEntity(VIDEO_PLUGIN_TYPE, 'IMMUTABLE', { src });
      const entityKey = contentStateWithEntity.getLastCreatedEntityKey();

      return AtomicBlockUtils.insertAtomicBlock(state, entityKey, ' ');
    }

    //defining video urls
    ...

    return videoUrls.reduce(buildNewEditorState, editorState);
}

问题在于渲染顺序：1。视频块; 2.链接块。

如何将此顺序更改为：1。链接块; 2.视频块。

Answer 1

好。问题出在selectionState中。

初始化状态初始化时，selectionState（锚点和焦点的位置）等于第一个块的第一个字符。所以AtomicBlockUtils.insertAtomicBlock方法将在selectionState和insert'atomic'之间拆分块。

决定：EditorsState.moveSelectionToEnd(editorState)。