如何删除react-draft-wysiwyg工具栏中的默认选项?

Naw*_* P. 8 editor rich-text-editor reactjs draftjs react-draft-wysiwyg

在此输入图像描述

根据我的问题,我想删除一些默认的工具栏选项,例如字体系列或表情符号,并仅保留文本样式选项。怎么做 ?

对于我的编辑来说。

<Editor
    editorState={editorState}
    wrapperClassName="demo-wrapper"
    onEditorStateChange={this.onEditorStateChange}
    toolbar={{
        inline: { inDropdown: true },
        list: { inDropdown: true },
        textAlign: { inDropdown: true },
        link: { inDropdown: true },
        history: { inDropdown: true },
    }}
/>
Run Code Online (Sandbox Code Playgroud)

Ned*_*rov 17

传递一个名为的数组,其中包含工具栏options属性中所需的所有选项。这是一个包含所有可用选项的数组:

options: ['inline', 'blockType', 'fontSize', 'fontFamily', 'list', 'textAlign', 'colorPicker', 'link', 'embedded', 'emoji', 'image', 'remove', 'history']

这是仅包含文本样式选项且不包含字体系列的示例

<Editor
    editorState={editorState}
    wrapperClassName="demo-wrapper"
    onEditorStateChange={this.onEditorStateChange}
    toolbar={{
        options: ['inline', 'blockType', 'fontSize', 'list', 'textAlign', 'history'],
        inline: { inDropdown: true },
        list: { inDropdown: true },
        textAlign: { inDropdown: true },
        link: { inDropdown: true },
        history: { inDropdown: true },
    }}
/>

Run Code Online (Sandbox Code Playgroud)

有关更多信息,请参阅:https://jpuri.github.io/react-draft-wysiwyg/#/docs

  • @Abhishekkumar您可以通过将数组“options”传递给“inline”属性来控制它。示例: `inline: { inDropdown: true, options: ['粗体', '斜体', '下划线', '删除线', '等宽', '上标', '下标'] }` (2认同)