2016-09-12 4 views
4

私は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インスタンスを作成するにはどうすればよいのですか?

(あなたがthis JSFiddleで、これらの異なる設定オプションを自分でプレイすることができます)

答えて

6

ツールバー用falsy値は正しいはずです:

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

はここでトラッキングのためのbug reportです。

+0

Quill 1.0.4以降で修正されました。 SOのことを見てくれてありがとう! – rockerest

関連する問題