0

Draft.js エディターにフォーカスを適用し、カーソルを最初の行/ブロックの先頭に配置する必要があります。エディターには複数の行/ブロックが含まれています。

適用されるだけthis.refs.editor.focus()で、カーソルは常にエディター内の 2 番目のブロック/行の先頭に配置されます。

この質問とこの問題をガイドとして使用して、以下のコードを試しましたが成功しませんでした。に渡すblockMapのcreateFromBlockArray()は正しくないと思われます：

focusTopLine() {

  this.refs.editor.focus();

  const { editorState } = this.state;
  const contentState = editorState.getCurrentContent();
  const selectionState = editorState.getSelection();
  const blockMap = contentState.getBlockMap();

  const newContentState = ContentState.createFromBlockArray(blockMap);
  const newEditorState = EditorState.createWithContent(newContentState);

  this.setState({
    editorState: EditorState.forceSelection(newEditorState, selectionState)
  });
}
4

2 に答える 2

5

(おそらく、私はこれをテストしていません) のEditorState.moveFocusToEnd()実装方法と同様に行うことができます。

EditorState最初に、最初のブロックが選択されている場所に新しいブロックを作成します。

function moveSelectionToStart(editorState) {
  const content = editorState.getCurrentContent()
  const firstBlock = content.getFirstBlock()
  const firstKey = firstBlock.getKey()
  const length = firstBlock.getLength()

  return EditorState.acceptSelection(
    editorState,
    new SelectionState({
      anchorKey: firstKey,
      anchorOffset: length,
      focusKey: firstKey,
      focusOffset: length,
      isBackward: false,
    })
  )
}

次に、それを使用してフォーカスを移動します。

function moveFocusToStart(editorState) {
  const afterSelectionMove = EditorState.moveSelectionToStart(editorState)
  return EditorState.forceSelection(
    afterSelectionMove,
    afterSelectionMove.getSelection()
  )
}

次のように使用できるようになりました。

this.setState({ editorState: moveFocusToStart(editorState) })
于 2016-11-08T15:04:44.627 に答える