題目形貌：

在運用 vue-quill-editor 富文本編輯器過程當中，加載已有的富文本數據到編輯器，常常會湧現編輯器中稀里糊塗多出一段換行內容
<p><br></p>（平常涌如今段落與其他內容之間，比方題目，援用，列表），每次從新編輯之前的內容時都必須手動刪除這些空行，不然這些換行就會越積越多。這讓我們的案牘小夥伴很不高興。

題目必須得處理，不然就又要換編輯器了。
先嘗試直接運用 DOM 設置 innerHtml 舉行設置原始內容，發明沒有勝利（在瀏覽器控制台能夠勝利，然則代碼中沒法設置，緣由不明，猜想編輯器內部做了庇護）。

然後看了一下 vue-quill-editor 中代碼，發明很簡單，它在 init 組件的時刻挪用了 quill 的pasteHTML要領。

// Set editor content
if (this.value || this.content) {
    this.quill.pasteHTML(this.value || this.content)
}

最先翻 quill 的源代碼，搜刮 pasteHTML，發明該要領（將被棄用）挪用了dangerouslyPasteHTML要領。該要領里有這麼一行是設置內容的：

this.quill.setContents(this.convert(index), html);

打印 convert函數的效果，發明返回的是 delta 對象。發明在多出換行的誰人位置多出了一些'\n'字符，在控制台里顯現如許↵↵。

convert函數挪用的是traverse函數，該函數把 node 轉化成了 delta對象 。
traverse函數中運用一系列的Matchers舉行內容婚配，个中最使我關注的兩個Matcher函數是matchNewline和matchSpacing，由於只要這兩個函數執行了delta.insert('\n');，在插進去\n的這兩個處所舉行測試輸出，發明重要題目在matchSpacing。該函數內有這麼一行：

var nodeHeight = node.offsetHeight + parseFloat(computeStyle(node).marginTop) + parseFloat(computeStyle(node).marginBottom);
if (node.nextElementSibling.offsetTop > node.offsetTop + nodeHeight * 1.5) {
  delta.insert('\n');
}

盤算 node 的現實高度 nodeHeight，然後拿下一個兄弟元素的 offsetTop 與 node.offsetTop + nodeHeight * 1.5舉行比較，假如前者比後者大，則插進去一個換行。（不是很清晰這麼做的目標，有主意的朋儕能夠留言說一下~），我們打印一下這三個值，發明係數1.5有點小，厥後我改成了2，基礎就不會有這類題目湧現了。

也就是說，我現在的處理辦法是把 quill.js 里係數1.5改成了2…..

ps:打印出 margin 的值，發明效果都是 0，設置 padding、line-height 也對這三個數據沒有任何影響。

願望有其他意見或許處理方案的朋儕能夠留言說一下.