フォーカスエディタ、最初のブロックの開始位置にカーソルを置く

Question

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

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

this questionとthis issueを参考にして、以下のコードを試してみました。私はcreateFromBlockArray()にblockMapを渡すことは正しくないと思われる：

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) 
    }); 
} 

Answer 1

あなたは（おそらく、私はこれをテストしていない）ことができ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) })