我如何“入侵”我的解决方案:
// Imports
import { EditorState,convertToRaw, ContentState, convertFromRaw, genKey, ContentBlock } from 'draft-js';
// Init some kind of block with a mention
let exampleState = {
blocks: [
{
key: genKey(), //Use the genKey function from draft
text: 'Some text with mention',
type: 'unstyled',
inlineStyleRanges: [],
data: {},
depth: 0,
entityRanges: [
{ offset: 15, length: 7, key: 0 }
]
}
],
entityMap: []
};
this.state.editorState = EditorState.createWithContent(convertFromRaw(exampleState));
在这里你可以创建一些函数来输入你的文本并输出一个entityRange返回提到的偏移/长度,并用突出显示的东西替换“entityRanges”数组!
在这个例子中,使用提及插件使用的任何样式都会突出显示“提及”一词
边注:
您可以使用草稿中的ContentBlock类或创建自己的实现来使其更漂亮