使用Quill.js在光标位置插入文本

Question

我正在尝试向quill.js添加一个自定义功能("模块"),似乎无法做到这一点.这就是我需要的:

如果想要添加一个插入模板替换变量的按钮...在编辑器中光标所在位置说{{company}}之类的内容,那么目前可能使用API​​ - 我想我可以使用insertText但是我似乎无法让它工作.

谢谢

Answer 1

您应该能够使用insertText执行此操作,但您可能需要使用getSelection来获取光标位置.getSelection返回的对象将具有索引和长度键.添加按钮和必要的单击处理程序将取决于实现者.注意焦点应该在使用焦点调用getSelection之前返回给编辑器,或者只是将true传递给getSelection.

Answer 2

我最终做了一个非常相似的设置：

let mergeFieldText = '{{company}}';
var selection = this._quill.getSelection(true);
this._quill.insertText(selection.index, mergeFieldText);

Answer 3

此代码片段是使用 Quill.js 在光标位置添加带有自定义按钮的符号。

首先声明鹅毛笔变量：

var quill = new Quill('.editor', {
    theme: 'snow'
});

通过按钮单击事件，在插入符号位置添加符号。

$('.symbols').click(function(){
    quill.focus();
    var symbol = $(this).html();
    var caretPosition = quill.getSelection(true);
    quill.insertText(caretPosition, symbol);
});