Quill добавляет нежелательные <br> в списки при использовании vue-quill-editor

Я полагаюсь на vue-quill-editor разрешить пользователям создавать заметки в моем приложении. Когда пользователь создает список в первый раз, он сохраняется по назначению.

Например, сохраненный HTML-код может выглядеть следующим образом:

<div> Test: </div>
   <ol>
     <li> One </li>
     <li> Two </li>
   </ol>

Однако, когда пользователь редактирует заметку, содержимое отображается с
тег до начала списка.

<div> Test: </div>
<br>
   <ol>
     <li> One </li>
     <li> Two </li>
   </ol>

Если пользователь не удалит этот тег, он будет сохранен. Новый
тег добавляется каждый раз, когда пользователь редактирует заметку. Поскольку я использую vue-quill-editor, я не уверен, смогу ли я использовать что-то вроде опасно PasteHTML для решения этой проблемы. Есть ли какая-либо конфигурация, которую я мог бы попытаться облегчить? Или я могу обернуть содержимое в некоторые теги, которые могут помочь?

Источник

3 ответа

Эта проблема может быть решена с помощью matchVisual: false конфигурация для модуля буфера буфера. Этот подход упоминается в ряде обсуждений на доске вопросов по Quill, но документация по конфигурации не очень ясна.

Мои параметры буфера обмена выглядят как

options : {
  modules: {
    toolbar: '#toolbar',
    clipboard: {
        matchVisual: false
    }
  }
}

Это решает проблему, и теги
не добавляются.

Источник

Это не имеет ничего общего с vue-quill-editorскорее это ограничение самого редактора Quill: https://github.com/quilljs/quill/issues/1235

Короче говоря это <p><br></p> представление пустого документа разработано и является основополагающим для работы Quill. Многие части кодовой базы Quill предполагают, что при любом заданном индексе в документе Quill есть блочный и встроенный блот. Таким образом, должна быть веская причина / выгода для изменения, и более удобная возможность обнаружения пустоты не достигает цели.

Источник

Потратив несколько часов на поиск решения этой проблемы, я нашел один способ удалить
теги.

Я использовал функцию javascript для удаления тегов

      filteredHTML = editorContent.replace('<br>','')

чтобы удалить все
из вывода редактора, используйте это

      filteredHTML = editorContent.replace(/<br>/g,'')
Источник
Другие вопросы по тегам