Draft.js 获取已设置样式的元素的选择或跨度
Draft.js get selection or span for already styled elements
我正在使用 react-rte 但我愿意扩展它所以让我们谈谈 Draft-js。
我需要能够 "inline-style" 选择。然后在后续渲染中重新访问该选择的 dom。
假设我突出显示了一个选择。然后我坚持文件。然后我回来，重新加载文档，我需要能够访问突出显示的部分，但在 dom 中。
基本上在文档的一侧，我在 draft-js 之外应用标记，这些标记需要与突出显示的部分对齐。因此，当我进行初始突出显示时，我可以从 window.getSelection() 获得 dom 位置，并且我可以放置我的标记。但是 dom 稍后可能会更改，我将无法放置我的标记。
--编辑--
所以另一个用例是我突出显示一个选择，即使在同一个会话中，我也需要以编程方式更改选择的颜色所以我再次需要访问文档的部分，即使光标不在在那个部分。
--结束编辑--
所以我真正需要的是一个独特的类名、id 甚至更好的 react ref，用于在您执行内联样式时创建的新跨度。
如果您需要更好的解释，请告诉我。
SelectionState记录选择，包括起始块、起始偏移量、结束块和结束偏移量。在您的代码中保存选择并稍后应用到编辑器是没有问题的。
So what I really need is something like an unique classname, id or even better a react ref for the new spans that are created when you do an inline style.
所以你想要的id是一个SelectionState，在draft-js编辑器中告诉span在哪里。
更新
您可以在 data-offset-key={blockkey}-xx-xx 节点属性中找到您的内联样式文本所属的 block key。 block key 帮助您从 SelectionState.getStartKey()/getEndKey() 中找到节点。然后通过SelectionState.getStartOffset()/getEndOffset().
找到span节点
我正在使用 react-rte 但我愿意扩展它所以让我们谈谈 Draft-js。
我需要能够 "inline-style" 选择。然后在后续渲染中重新访问该选择的 dom。
假设我突出显示了一个选择。然后我坚持文件。然后我回来，重新加载文档，我需要能够访问突出显示的部分，但在 dom 中。
基本上在文档的一侧，我在 draft-js 之外应用标记，这些标记需要与突出显示的部分对齐。因此，当我进行初始突出显示时，我可以从 window.getSelection() 获得 dom 位置，并且我可以放置我的标记。但是 dom 稍后可能会更改，我将无法放置我的标记。
--编辑--
所以另一个用例是我突出显示一个选择，即使在同一个会话中，我也需要以编程方式更改选择的颜色所以我再次需要访问文档的部分，即使光标不在在那个部分。
--结束编辑--
所以我真正需要的是一个独特的类名、id 甚至更好的 react ref，用于在您执行内联样式时创建的新跨度。
如果您需要更好的解释，请告诉我。
SelectionState记录选择，包括起始块、起始偏移量、结束块和结束偏移量。在您的代码中保存选择并稍后应用到编辑器是没有问题的。
So what I really need is something like an unique classname, id or even better a react ref for the new spans that are created when you do an inline style.
所以你想要的id是一个SelectionState，在draft-js编辑器中告诉span在哪里。
更新
您可以在 data-offset-key={blockkey}-xx-xx 节点属性中找到您的内联样式文本所属的 block key。 block key 帮助您从 SelectionState.getStartKey()/getEndKey() 中找到节点。然后通过SelectionState.getStartOffset()/getEndOffset().
span节点