エディタからテキストを削除し、デルタ変化を表しています。ソース多分"user"、"api"、 また"silent"。どこに呼び出しますかsourceは"user"編集者がいるとき無効無視されます。
メソッド
deleteText(index: Number, length: Number, source: String = 'api'): Delta
例
quill.deleteText(6, 4);
で表されるフォーマットデータを含むエディターのコンテンツを取得します。デルタ物体。
メソッド
getContents(index: Number = 0, length: Number = remaining): Delta
例
var delta = quill.getContents();
エディターのコンテンツの長さを取得します。 Quill が空の場合でも、「\n」で表される空行がまだ存在することに注意してください。getLength1を返します。
メソッド
getLength(): Number
例
var length = quill.getLength();
エディターの文字列コンテンツを取得します。文字列以外のコンテンツは省略されるため、返される文字列の長さは、エディターが返す文字列の長さよりも短くなる可能性があります。getLength。 Quill が空の場合でも、エディターにはまだ空行が存在することに注意してください。getText「\n」を返します。
のlengthパラメータのデフォルトは、残りのドキュメントの長さになります。
メソッド
getText(index: Number = 0, length: Number = remaining): String
例
var text = quill.getText(0, 10);
埋め込みコンテンツをエディタに挿入し、デルタ変化を表しています。ソース多分"user"、"api"、 また"silent"。どこに呼び出しますかsourceは"user"編集者がいるとき無効無視されます。
メソッド
insertEmbed(index: Number, type: String, value: any, source: String = 'api'): Delta
例
quill.insertEmbed(10, 'image', 'https://quilljs.com/images/cloud.png');
オプションで指定された形式または複数の形式でテキストをエディタに挿入します。フォーマット。を返しますデルタ変化を表しています。ソース多分"user"、"api"、 また"silent"。どこに呼び出しますかsourceは"user"編集者がいるとき無効無視されます。
メソッド
insertText(index: Number, text: String, source: String = 'api'): Delta
insertText(index: Number, text: String, format: String, value: any,
source: String = 'api'): Delta
insertText(index: Number, text: String, formats: { [String]: any },
source: String = 'api'): Delta
例
quill.insertText(0, 'Hello', 'bold', true);
quill.insertText(5, 'Quill', {
'color': '#ffff00',
'italic': true
});
エディターを指定された内容で上書きします。コンテンツは次で終わる必要があります改行。変更を表すデルタを返します。デルタに無効な操作がなかった場合、これは渡されたデルタと同じになります。ソース多分"user"、"api"、 また"silent"。どこに呼び出しますかsourceは"user"編集者がいるとき無効無視されます。
メソッド
setContents(delta: Delta, source: String = 'api'): Delta
例
quill.setContents([
{ insert: 'Hello ' },
{ insert: 'World!', attributes: { bold: true } },
{ insert: '\n' }
]);
エディターのコンテンツを指定されたテキストで設定し、デルタ変化を表しています。注: Quill ドキュメントは改行で終わる必要があるため、省略した場合は改行が追加されます。ソース多分"user"、"api"、 また"silent"。どこに呼び出しますかsourceは"user"編集者がいるとき無効無視されます。
メソッド
setText(text: String, source: String = 'api'): Delta
例
quill.setText('Hello\n');
デルタをエディターのコンテンツに適用し、デルタ変化を表しています。渡されたデルタに無効な操作がなかった場合、これらのデルタは同じになります。ソース多分"user"、"api"、 また"silent"。どこに呼び出しますかsourceは"user"編集者がいるとき無効無視されます。
メソッド
updateContents(delta: Delta, source: String = 'api'): Delta
例
// Assuming editor currently contains [{ insert: 'Hello World!' }]
quill.updateContents(new Delta()
.retain(6) // Keep 'Hello '
.delete(5) // 'World' is deleted
.insert('Quill')
.retain(1, { bold: true }) // Apply bold to exclamation mark
);
// Editor should now be [
// { insert: 'Hello Quill' },
// { insert: '!', attributes: { bold: true} }
// ]
ユーザーの現在の選択内容でテキストをフォーマットし、デルタ変化を表しています。ユーザーの選択長が 0 の場合、つまりカーソルの場合、フォーマットがアクティブに設定されるため、ユーザーが入力する次の文字にはそのフォーマットが適用されます。ソース多分"user"、"api"、 また"silent"。どこに呼び出しますかsourceは"user"編集者がいるとき無効無視されます。
メソッド
format(name: String, value: any, source: String = 'api'): Delta
例
quill.format('color', 'red');
quill.format('align', 'right');
指定された範囲内のすべての行をフォーマットし、デルタ変化を表しています。見るフォーマット利用可能な形式のリストについては、インライン形式で呼び出された場合は効果がありません。書式設定を削除するには、次のように渡しますfalse値引数の場合。ユーザーの選択は保存されない場合があります。ソース多分"user"、"api"、 また"silent"。どこに呼び出しますかsourceは"user"編集者がいるとき無効無視されます。
メソッド
formatLine(index: Number, length: Number, source: String = 'api'): Delta
formatLine(index: Number, length: Number, format: String, value: any,
source: String = 'api'): Delta
formatLine(index: Number, length: Number, formats: { [String]: any },
source: String = 'api'): Delta
例
quill.setText('Hello\nWorld!\n');
quill.formatLine(1, 2, 'align', 'right'); // right aligns the first line
quill.formatLine(4, 4, 'align', 'center'); // center aligns both lines
エディターでテキストをフォーマットし、デルタ変化を表しています。テキストの配置などの行レベルの形式の場合は、改行文字をターゲットにするか、formatLineヘルパー。見るフォーマット利用可能な形式のリストについては、書式設定を削除するには、次のように渡しますfalse値引数の場合。ユーザーの選択は保存されない場合があります。ソース多分"user"、"api"、 また"silent"。どこに呼び出しますかsourceは"user"編集者がいるとき無効無視されます。
メソッド
formatText(index: Number, length: Number, source: String = 'api'): Delta
formatText(index: Number, length: Number, format: String, value: any,
source: String = 'api'): Delta
formatText(index: Number, length: Number, formats: { [String]: any },
source: String = 'api'): Delta
例
指定された範囲内のテキストの一般的な書式設定を取得します。レポートされる形式では、範囲内のすべてのテキストが真の値を持っている必要があります。異なる真の値がある場合は、すべての真の値を含む配列が報告されます。範囲が指定されていない場合は、ユーザーの現在の選択範囲が使用されます。カーソルにどの形式が設定されているかを表示するために使用できます。引数なしで呼び出された場合は、ユーザーの現在の選択範囲が使用されます。
メソッド
getFormat(range: Range = current): { [String]: any }
getFormat(index: Number, length: Number = 0): { [String]: any }
例
quill.setText('Hello World!');
quill.formatText(0, 2, 'bold', true);
quill.formatText(1, 2, 'italic', true);
quill.getFormat(0, 2); // { bold: true }
quill.getFormat(1, 1); // { bold: true, italic: true }
quill.formatText(0, 2, 'color', 'red');
quill.formatText(2, 1, 'color', 'blue');
quill.getFormat(0, 3); // { color: ['red', 'blue'] }
quill.setSelection(3);
quill.getFormat(); // { italic: true, color: 'blue' }
quill.format('strike', true);
quill.getFormat(); // { italic: true, color: 'blue', strike: true }
quill.formatLine(0, 1, 'align', 'right');
quill.getFormat(); // { italic: true, color: 'blue', strike: true,
// align: 'right' }
すべての書式設定を削除し、指定された範囲内に埋め込んで、デルタ変化を表しています。行の一部が範囲に含まれる場合、行の書式設定は削除されます。ユーザーの選択は保存されない場合があります。ソース多分"user"、"api"、 また"silent"。どこに呼び出しますかsourceは"user"編集者がいるとき無効無視されます。
メソッド
removeFormat(index: Number, length: Number, source: String = 'api'): Delta
例
quill.setContents([
{ insert: 'Hello', { bold: true } },
{ insert: '\n', { align: 'center' } },
{ insert: { formula: 'x^2' } },
{ insert: '\n', { align: 'center' } },
{ insert: 'World', { italic: true }},
{ insert: '\n', { align: 'center' } }
]);
quill.removeFormat(3, 7);
// Editor contents are now
// [
// { insert: 'Hel', { bold: true } },
// { insert: 'lo\n\nWo' },
// { insert: 'rld', { italic: true }},
// { insert: '\n', { align: 'center' } }
// ]
指定された場所での選択範囲のピクセル位置 (エディター コンテナーを基準とした) と寸法を取得します。ユーザーの現在の選択がそのインデックスにある必要はありません。ツールチップを配置する場所を計算するのに役立ちます。
メソッド
getBounds(index: Number, length: Number = 0):
{ left: Number, top: Number, height: Number, width: Number }
例
quill.setText('Hello\nWorld\n');
quill.getBounds(7); // Returns { height: 15, width: 0, left: 27, top: 31 }
ユーザーの選択範囲を取得します。オプションで最初にエディターにフォーカスします。さもないとnullエディターにフォーカスがない場合に返されることがあります。
メソッド
getSelection(focus = false): { index: Number, length: Number }
例
var range = quill.getSelection();
if (range) {
if (range.length == 0) {
console.log('User cursor is at index', range.index);
} else {
var text = quill.getText(range.index, range.length);
console.log('User has highlighted: ', text);
}
} else {
console.log('User cursor is not in editor');
}
ユーザー選択を指定された範囲に設定します。これにより、エディターもフォーカスされます。提供するnull選択範囲によりエディターがぼやけるためです。ソース多分"user"、"api"、 また"silent"。
メソッド
setSelection(index: Number, length: Number = 0, source: String = 'api')
setSelection(range: { index: Number, length: Number },
source: String = 'api')
例
quill.setSelection(0, 5);
エディターからフォーカスを削除します。
メソッド
blur()
例
quill.blur();
の略記enable(false)。
マウスやキーボードなどの入力デバイスを介してユーザーが編集できるように設定します。 API 呼び出しの機能には影響しません。sourceは"api"または「サイレント」。
メソッド
enable(enabled: boolean = true)
例
quill.enable();
quill.enable(false); // Disables user input
エディターをフォーカスし、その最後の範囲を復元します。
メソッド
focus()
例
quill.focus();
エディターにフォーカスがあるかどうかを確認します。ツールバーやツールヒントに焦点を当てても、エディターとしてカウントされないことに注意してください。
メソッド
hasFocus(): Boolean
例
quill.hasFocus();
エディターでユーザーの更新を同期的にチェックし、変更が発生した場合はイベントを発生させます。最新の状態を必要とする競合解決時の共同使用ケースに役立ちます。ソース多分"user"、"api"、 また"silent"。
メソッド
update(source: String = 'user')
例
quill.update();
Quill の内容が変更されたときに発生します。変更の詳細、変更前のエディターの内容の表現、および変更のソースが提供されます。ソースは次のとおりです"user"それがユーザーからのものである場合。例えば：
変更は API を通じて発生する可能性がありますが、ユーザーからのものである限り、提供されたソースは依然としてそのままである必要があります。"user"。たとえば、ユーザーがツールバーをクリックすると、技術的には、ツールバー モジュールが Quill API を呼び出して変更を有効にします。でもソースはまだ"user"なぜなら、変化の根源はユーザーのクリックだったからです。
テキストを変更する API は、"silent"ソース、その場合はtext-changeは排出されません。これは、テキスト変更の完全な記録に依存する元に戻すスタックやその他の機能を破壊する可能性があるため、お勧めできません。
テキストを変更すると、選択内容が変更されることがあります (例: 入力するとカーソルが進みます)。text-changeハンドラーでは、選択内容はまだ更新されておらず、ブラウザーのネイティブの動作によって一貫性のない状態になる可能性があります。使用selection-changeまたeditor-change信頼性の高い選択の更新のために。
コールバック署名
handler(delta: Delta, oldContents: Delta, source: String)
例
quill.on('text-change', function(delta, oldDelta, source) {
if (source == 'api') {
console.log("An API call triggered this change.");
} else if (source == 'user') {
console.log("A user action triggered this change.");
}
});
ユーザーまたは API によって選択範囲が変更されたときに発行され、範囲が選択範囲の境界を表します。 NULL 範囲は、選択が失われたことを示します (通常、エディターからのフォーカスの喪失によって引き起こされます)。発行された範囲が null かどうかを確認するだけで、このイベントをフォーカス変更イベントとして使用することもできます。
選択を変更する API は、"silent"ソース、その場合はselection-changeは排出されません。これは次の場合に便利ですselection-change副作用です。たとえば、入力すると選択範囲が変更されますが、同時に出力すると非常にノイズが多くなります。selection-change各キャラクターごとにイベントが発生。
コールバック署名
handler(range: { index: Number, length: Number },
oldRange: { index: Number, length: Number },
source: String)
例
quill.on('selection-change', function(range, oldRange, source) {
if (range) {
if (range.length == 0) {
console.log('User cursor is on', range.index);
} else {
var text = quill.getText(range.index, range.length);
console.log('User has highlighted', text);
}
} else {
console.log('Cursor not in the editor');
}
});
いずれかの場合に発行されますtext-changeまたselection-changeソースが"silent"。最初のパラメータはイベント名です。text-changeまたselection-change、その後に通常はそれぞれのハンドラーに渡される引数が続きます。
コールバック署名
handler(name: String, ...args)
例
quill.on('editor-change', function(eventName, ...args) {
if (eventName === 'text-change') {
// args[0] will be delta
} else if (eventName === 'selection-change') {
// args[0] will be old range
}
});
イベントハンドラを追加します。見るテキスト変更また選択変更イベント自体の詳細については、
メソッド
on(name: String, handler: Function): Quill
例
quill.on('text-change', function() {
console.log('Text change!');
});
イベントの 1 つの発行に対するハンドラーを追加します。見るテキスト変更また選択変更イベント自体の詳細については、
メソッド
once(name: String, handler: Function): Quill
例
quill.once('text-change', function() {
console.log('First text change!');
});
イベントハンドラを削除します。
メソッド
off(name: String, handler: Function): Quill
例
function handler() {
console.log('Hello!');
}
quill.on('text-change', handler);
quill.off('text-change', handler);
Quill を返す静的メソッドまたはブロット指定された DOM ノードのインスタンス。後者の場合、bubbleパラメータは、対応する DOM が見つかるまで、指定された DOM の祖先を検索します。ブロット。
メソッド
Quill.find(domNode: Node, bubble: boolean = false): Blot | Quill
例
var container = document.querySelector("#container");
var quill = new Quill(container);
console.log(Quill.find(container) === quill); // Should be true
quill.insertText(0, 'Hello', 'link', 'https://world.com');
var linkNode = document.querySelector('#container a');
var linkBlot = Quill.find(linkNode);
ドキュメントの先頭から指定された文字列の出現までの距離を返します。ブロット。
メソッド
getIndex(blot: Blot): Number
例
let [line, offset] = quill.getLine(10);
let index = quill.getIndex(line); // index + offset should == 10
葉を返しますブロットドキュメント内の指定されたインデックスにあります。
メソッド
getLeaf(index: Number): Blot
例
quill.setText('Hello Good World!');
quill.formatText(6, 4, "bold", true);
let [leaf, offset] = quill.getLeaf(7);
// leaf should be a Text Blot with value "Good"
// offset should be 1, since the returned leaf started at index 6
行を返しますブロットドキュメント内の指定されたインデックスにあります。
メソッド
getLine(index: Number): [Blot, Number]
例
quill.setText('Hello\nWorld!');
let [line, offset] = quill.getLine(7);
// line should be a Block Blot representing the 2nd "World!" line
// offset should be 1, since the returned line started at index 6
指定された場所に含まれる行を返します。
メソッド
getLines(index: Number = 0, length: Number = remaining): Blot[]
getLines(range: Range): Blot[]
例
quill.setText('Hello\nGood\nWorld!');
quill.formatLine(1, 1, 'list', 'bullet');
let lines = quill.getLines(2, 5);
// array with a ListItem and Block Blot,
// representing the first two lines
特定のレベルでメッセージのロギングを有効にする静的メソッド:'error'、'warn'、'log'、 また'info'。通過true合格と同等です'log'。通過falseすべてのメッセージを無効にします。
メソッド
Quill.debug(level: String | Boolean)
例
Quill.debug('info');
Quill ライブラリ、フォーマット、モジュール、またはテーマを返す静的メソッド。一般に、パスは Quill ソース コードのディレクトリ構造に正確にマップされる必要があります。特に明記されていない限り、返されたエンティティを変更すると、必要な Quill 機能が壊れる可能性があるため、行わないことを強くお勧めします。
メソッド
Quill.import(path): any
例
var Parchment = Quill.import('parchment');
var Delta = Quill.import('delta');
var Toolbar = Quill.import('modules/toolbar');
var Link = Quill.import('formats/link');
// Similar to ES6 syntax `import Link from 'quill/formats/link';`
モジュール、テーマ、またはフォーマットを登録し、エディターに追加できるようにします。後で次のように取得できますQuill.import。次のパス接頭辞を使用します'formats/'、'modules/'、 また'themes/'それぞれフォーマット、モジュール、テーマを登録します。特にフォーマットの場合は、フォーマットを直接渡すだけの省略表現があり、パスが自動生成されます。同じパスを持つ既存の定義を上書きします。
メソッド
Quill.register(format: Attributor | BlotDefinintion, supressWarning: Boolean = false)
Quill.register(path: String, def: any, supressWarning: Boolean = false)
Quill.register(defs: { [String]: any }, supressWarning: Boolean = false)
例
var Module = Quill.import('core/module');
class CustomModule extends Module {}
Quill.register('modules/custom-module', CustomModule);
Quill.register({
'formats/custom-format': CustomFormat,
'modules/custom-module-a': CustomModuleA,
'modules/custom-module-b': CustomModuleB,
});
Quill.register(CustomFormat);
// You cannot do Quill.register(CustomModuleA); as CustomModuleA is not a format
Quill コンテナ内に、エディタ自体の兄弟となるコンテナ要素を追加して返します。慣例により、Quill モジュールのクラス名には接頭辞が付けられます。ql-。オプションで、コンテナを先に挿入する必要がある refNode を含めます。
メソッド
addContainer(className: String, refNode?: Node): Element
addContainer(domNode: Node, refNode?: Node): Element
例
var container = quill.addContainer('ql-custom');
エディターに追加されたモジュールを取得します。
メソッド
getModule(name: String): any
例
var toolbar = quill.getModule('toolbar');