在 draft-js NPM 中突出显示单词

Question

我有一个 draft-js 富编辑器。我所需要的只是突出显示我可以在数组中提供给它的一些词。就像我可以向我的编辑器提供一些数组中的单词，并基于一些 class，它可以突出显示这些单词。

任何关于使用 draft-js 执行相同操作的外部库的信息都会有所帮助

 import Editor from 'draft-js-plugins-editor';
 import { EditorState } from 'draft-js';

    class Child extends React.Component {
    constructor(props){
      super(props);
      this.state={
        editorState:EditorState.createEmpty()
      }
    }

    updateEditorState(editorState){
      this.setState(
        {editorState}
      );
    }

        render() {      
          return (<div className="editor-container"> 
          <Editor placeholder="Explore your way in..."
          editorState={this.state.editorState}
          onChange={this.updateEditorState.bind(this)}

          />

           </div>);

        }
      }

Answer 1

尝试使用复合装饰器https://draftjs.org/docs/advanced-topics-decorators#compositedecorator

Codesandbox 示例：https://codesandbox.io/s/jovial-bhaskara-ozxi6

在 draft-js NPM 中突出显示单词

Highlight words in draft-js NPM

reactjs

draftjs

draft-js-plugins