javascript - 如何在 Draft.js 中创建基于开始和结束的选择？

Question

我正在尝试替换 Draft.js 中的最后一个插入

例如，

Orignal string -> aaazzz

After inserting 'bbb' in the middle -> aaabbbzzz

Replace last insert by 'ccc' -> aaaccczzz

Replace last insert by 'ddd' -> aaadddzzz

...

我想到的一种方法是保存插入起点。插入后，保存终点。然后我可以稍后更换范围

这是我的插入代码

const selection1 = editorState.getSelection();
const contentState1 = editorState.getCurrentContent();

const contentState2 = Modifier.insertText(contentState, selection, text);
const editorState2 = EditorState.push(editorState, newContentState);
const selection2 = newEditorState.getSelection();
// here I don't know how to get the range based on selection1 and selection2

我可以用

const start = selection1.getStartOffset();
const end = selection2.getEndOffset();

获取起点和终点两个数字。

基于的定义

replaceText(
  contentState: ContentState,
  rangeToReplace: SelectionState,
  text: string,
  inlineStyle?: DraftInlineStyle,
  entityKey?: ?string
): ContentState

我需要重新选择。如何使用这两个数字或 selection1 和 selection2 创建选择？有没有类似的功能

createSelection(start, end)  // not exist

Answer 1

文档说:

var selectionState = SelectionState.createEmpty('blockkey');
var updatedSelection = selectionState.merge({
  focusOffset: 0,
  anchorOffset:20,
});

所以你需要获取 block key 然后设置偏移量。开始/结束对应于 anchor /焦点，因为在您的情况下。