在 React Quill 组件中允许标签

Question

我正在尝试将以下内容加载到 ReactQuill 组件中，但它不断剥离其内部 html 标签，例如 <mark>.

<mark><i><b>[CLIENT NAME]</b></i></mark>

组件将其变成如下：

<p><strong><em>[CLIENT NAME]</em></strong></p>

羽毛笔组件：

<ReactQuill
 {...{
   key: 'content',
   value: this.state.content,
   onChange: handleContent,
 }}
/>

有没有办法为标签添加例外，以便组件忽略标签？

Answer 1

您需要定义自定义格式，see this。定义 Mark 格式应该允许 Quill 识别并正确处理您的 html

class MarkBlot extends Inline { }
MarkBlot.blotName = 'mark';
MarkBlot.tagName = 'mark';
Quill.register(MarkBlot);

Allow tags in React Quill component