javascript - 跨多个编辑器共享 Quill 工具栏

Question

与伟大的Quill Javascript 的富文本编辑器我试图让两个或多个编辑器共享同一个工具栏。

我想(来自 documentation )目前这是不可能的，所以我试图通过在被点击为后者的编辑器上通过 API 添加工具栏模块来“模拟”这一点:

// this uses jQuery
$editorTag.click(function(e){
    var tag = e.target;
    var editor = getEditorByTag(tag);
    if( editor )
        editor.addModule('toolbar',{container:'#toolbar'});
});

它似乎有效，但我怀疑 Quill 不喜欢在同一个对象上一遍又一遍地添加相同的模块，因为它最终会吐出:

(node) warning: possible EventEmitter memory leak detected. 11 listeners added. Use emitter.setMaxListeners() to increase limit. quill.js (row 4727)

那么有没有办法删除以前添加的模块？就像是:

// installs editor
var editor = new Quill('#editor');
// adds toolbar module
editor.addModule('toolbar',{container:'#toolbar'});
// removes just added toolbar module
editor.removeModule('toolbar');

Answer 1

前几天我遇到了同样的问题，并找到了适合我们用例的解决方案。这基本上就是我所做的:

I'm creating one instance of Quill, using a custom toolbar positionedat the top. The editor element is placed in a temporary, hidden,container. When the user double clicks any of the three textcontainers (Editables), the editor element will be transplanted formthe temporary container to a new location inside the Editable. If auser hits the escape key, the Editable will be deactivated, moving theeditor element back to the temporary container.

你可以在这里测试它: https://codesandbox.io/s/hungry-pine-o8oh9?file=/src/App.js
GitHub 仓库: https://github.com/maxfahl/Quill-Edit-Multiple
随意使用您喜欢的代码。