Quillを使用したテキストエディタの作成:構成(#3)


設定(優先パラメータ)
Quillを使用すると、ユーザーが望む方向に設定できます.このセクションでは、既存の機能の調整にのみ使用します.新しい機能を追加するには、モジュールセクションを参照してください.モデリングするには、トピックセクションを参照してください.
Container
Quillにはエディタを含むコンテナが必要です.このコンテナにCSSセレクタまたはDOMオブジェクトを渡すことができます.コンテナとしてDOM要素を指定してQuillインスタンスを作成すると、エディタがコンテナに挿入されます.
第一の方法
const editor = new Quill('.editor');  // 첫번째 DOM element에 적용된다.
第2の方法
const container = document.getElementById('editor');
const editor = new Quill(container);
Options
Quillを設定するには、オプションのオブジェクトを渡すだけです.
const options = {
  debug: 'info',
  modules: {
    toolbar: '#toolbar'
  },
  placeholder: 'Compose an epic...',
  readOnly: true,
  theme: 'snow'
};
const editor = new Quill('#editor', options);
次のオブジェクトキーをオプションとして使用できます.
bounds
デフォルト:document.bodyツールヒントなど、編集者の要素の範囲を制限します.
debug
デフォルト:warnこれはdebugのショートカットオプションです.ログ・メッセージの受信方法を設定できます.デフォルト値はwarnで、それ以外にerrorloginfoがあります.
format
デフォルト:すべてのフォーマット
エディタで許可されるフォーマットを指定します.コンテンツが指定されていない場合は、すべてのフォーマットのコピーが許可されます.ここです。ヘルメットの種類を確認できます.
modules
含めるモジュールを指定します.ここです。次モジュールの詳細を表示できます.
placeholder
デフォルト:なし
エディタが空の場合に表示されるテキスト.
readOnly
Default: falseエディタを読み取り専用にするかどうかを選択します.
scrollingContainer
Default: nullDOM Element or a CSS selector for a DOM Element, specifying which container has the scrollbars (i.e. overflow-y: auto), if is has been changed from the default ql-editor with custom CSS. Necessary to fix scroll jumping bugs when Quill is set to auto grow its height, and another ancestor container is responsible from the scrolling.
theme
使用するトピックを指定します.Quillのデフォルトのトピックは「bubble」と「snow」です.値が無効またはfalseの場合、デフォルトのトピックがロードされます.トピックのCSSはlink tagを使用して手動で挿入する必要があります.詳細については、テーマを参照してください.
ソース
https://quilljs.com/docs/configuration/