Draft.js 编辑器中第一行的最开始处的光标

Question

我有一个 onUpArrow 处理程序需要检查光标是否位于 Draft.js 编辑器中第一行的开头。编辑器可能包含多个lines/blocks.

我发现 SelectionState 方法如 getAnchorOffset() 和 getStartOffset() 可以通过返回 0 告诉我光标在一行的开头，但是值在任何 line/block 的开头返回，而不仅仅是编辑器中的第一个。

此 issue 参考了 "get start or end of document or to get the exact cursor position"，但似乎并未将其纳入草稿来源。

有谁知道检测光标是否位于编辑器内容开头的方法吗？

Answer 1

根据您的检查，这 editorState.getCurrentContent().getBlockMap().first().getKey() === selectionState.getAnchor/FocusKey()

Answer 2

这是我如何使用标准 handleKeyCommand 函数检测我是否在 第一行的 start 处的示例 DraftJS 编辑器：

handleKeyCommand(command, editorState) {

  const selectionState = editorState.getSelection()

  const firstline = (editorState.getCurrentContent().getBlockMap().first().getKey() == selectionState.getFocusKey())

  const startofline = (selectionState.getAnchorOffset() == 0)

  if (firstline && startofline) {
    // Your caret is at the start of the first line of your DraftJS editor.
  }
}

Draft.js 编辑器中第一行的最开始处的光标

Cursor at very start of first line in Draft.js editor

reactjs

draftjs