Разрешить теги в компоненте React Quill

Я пытаюсь загрузить следующий контент в компонент 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,
 }}
/>

Есть ли способ добавить исключения для тегов, чтобы компонент игнорировал тег?


person AspiringCanadian    schedule 11.05.2018    source источник
comment
Как вы загружаете свое содержимое непосредственно в узел quill DOM перед его созданием?   -  person guillaumepotier    schedule 14.05.2018
comment
Обновление контента через состояние.   -  person AspiringCanadian    schedule 14.05.2018
comment
Извините, не знаю, как ReactQuill работает с контентом, я использую Quill непосредственно в своем приложении React. Возможно, вы захотите создать новый формат MarkFormat и зарегистрировать его в Quill (с Parchment). Таким образом, когда Quill увидит ваш html, он будет обрабатывать и поддерживать ваш тег mark, потому что он имеет зарегистрированный формат   -  person guillaumepotier    schedule 15.05.2018


Ответы (1)


Вам нужно будет определить собственный формат, см. это. Определение формата Mark должно позволить Quill распознавать и правильно обрабатывать ваш HTML-код.

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