一次使用两个操作更新 editorState答案

【问题标题】：Update editorState with two operations at once一次使用两个操作更新 editorState
【发布时间】：2017-04-13 16:57:10
【问题描述】：

当我输入space 栏时，我试图将一个单词分成两个单词。我文本中的每个单词都是一个实体，所以当我将一个单词一分为二时，我需要更新文本并创建一个新实体。

我使用Modifier 模块进行这两个更新。

const editorStateAfterText = 
  EditorState.push(
    editorState,
    Modifier.insertText(
      contentState,
      selectionState,
      ' ',
    ),
    command,
  );
const editorStateAfterEntity =
  EditorState.push(
    editorStateAfterText,
    Modifier.applyEntity(
      contentState,
      newSelectionState,
      newEntityKey
    ),
    command,
  );
this.setState({editorState: editorStateAfterEntity})

我正在尝试一次使用两个操作更新编辑器状态。如果另一个不存在，它们都可以工作。当这两个存在时，它只更新最后一个。

有什么方法可以更新文本（分词）并将新实体添加到entityMap？

【问题讨论】：

标签： draftjs draft-js-plugins

【解决方案1】：

根据文档https://draftjs.org/docs/api-reference-editor-state.html#push 中的定义，push 要求 3 个参数：editorState、contentState 和 command。

我在editorStateAfterEntity 中通过editorStateAfterText 传递更新的editorState 参数做得很好，但我忽略了更新的contentState。

这就是它最终的工作方式：

  const contentAfterText = Modifier.insertText(
    contentState,
    selectionState,
    ' ',
  );
  const editorStateAfterText = EditorState.push(
    editorState,
    contentAfterText,
    command,
  );
  const contentStateAfterTextAndEntity = Modifier.applyEntity(
    contentAfterText,
    newSelectionState,
    newEntityKey
  );
  const editorStateAfterTextAndEntity = EditorState.push(
    editorStateAfterText,
    contentStateAfterTextAndEntity,
    command,
  );
  this.setState({editorState: editorStateAfterTextAndEntity});

【讨论】：