如何在沒有工具欄的情況下創建一個Quill編輯器？

Question

我想使用Quill，但不顯示編輯器工具欄（或「泡泡」選項）。我基本上喜歡用Quill/Parchment支持它的文本區域。

但是，每當我創建一個新的Quill元素時，即使我不要求它，我總是會得到工具欄。此外，刪除工具欄會導致JavaScript錯誤，該錯誤會破壞頁面上運行的其他任何內容。

默認：

var config = { 
 
    "theme": "snow" 
 
}; 
 

 
var quill = new Quill(".editor", config);

<script src="https://cdn.quilljs.com/1.0.3/quill.js"></script> 
 
<link href="https://cdn.quilljs.com/1.0.3/quill.snow.css" rel="stylesheet"/> 
 

 
<div class="editor"></div>

設置模塊，一個空對象是相同的（我相信這是默認反正）：

var config = { 
 
    "theme": "snow", 
 
    "modules": {} 
 
}; 
 

 
var quill = new Quill(".editor", config);

<script src="https://cdn.quilljs.com/1.0.3/quill.js"></script> 
 
<link href="https://cdn.quilljs.com/1.0.3/quill.snow.css" rel="stylesheet"/> 
 

 
<div class="editor"></div>

設置在JavaScript錯誤的工具欄模塊要麼false或null結果：

var config = { 
 
    "theme": "snow", 
 
    "modules": { 
 
     "toolbar": false 
 
    } 
 
}; 
 

 
var quill = new Quill(".editor", config);

<script src="https://cdn.quilljs.com/1.0.3/quill.js"></script> 
 
<link href="https://cdn.quilljs.com/1.0.3/quill.snow.css" rel="stylesheet"/> 
 

 
<div class="editor"></div>

var config = { 
 
    "theme": "snow", 
 
    "modules": { 
 
     "toolbar": null 
 
    } 
 
}; 
 

 
var quill = new Quill(".editor", config);

<script src="https://cdn.quilljs.com/1.0.3/quill.js"></script> 
 
<link href="https://cdn.quilljs.com/1.0.3/quill.snow.css" rel="stylesheet"/> 
 

 
<div class="editor"></div>

這就是我想要的，但是這似乎是一個哈克解決方法我不喜歡它：

var config = { 
 
    "theme": "snow", 
 
    "modules": { 
 
    "toolbar": ".quill-always-hidden-toolbar" 
 
    } 
 
}; 
 

 
var quill = new Quill(".editor", config);

.quill-always-hidden-toolbar{ 
 
    display: none; 
 
    visibility: hidden; 
 
    width: 0; 
 
    height: 0; 
 
} 
 

 
.quill-always-hidden-toolbar.ql-toolbar.ql-snow + .ql-container.ql-snow{ 
 
    border-top: 1px solid #ccc; 
 
}

<link href="https://cdn.quilljs.com/1.0.3/quill.snow.css" rel="stylesheet"/> 
 
<script src="https://cdn.quilljs.com/1.0.3/quill.js"></script> 
 

 
<div class="quill-always-hidden-toolbar"></div> 
 
<div class="editor"></div>

看來沒有辦法不有一個工具欄上的鵝毛筆編輯短渲染成是始終display: none DOM節點的。這是真的，還是有沒有渲染工具欄的更優雅的方式？

tl; dr：我不想使用Quill工具欄，如何在沒有工具欄的情況下創建新的Quill實例？

Answer 1

的工具欄falsy值應該是正確的（你可以用這些不同的配置選項，在自己玩this JSFiddle）：

var config = { 
    "theme": "snow", 
    "modules": { 
     "toolbar": false 
    } 
}; 

這裏有一個跟蹤bug report。