我想在鹅毛笔中导入处理程序。
但是我仍然收到此错误Uncaught TypeError: moduleClass is not a constructor
这就是鹅毛笔功能的工作原理
import Quill from 'quill';
// IMAGE HANDLER
const imageHandler = () => {
const input = document.createElement('input');
input.setAttribute('type', 'file');
input.setAttribute('accept', 'image/*');
input.click();
input.onchange = async () => {
const file = input.files[0];
const formData = new FormData();
formData.append('image', file);
// Save current cursor state
const range = this.quill.getSelection(true);
// Insert temporary loading placeholder image
this.quill.insertEmbed(range.index, 'image', `${ window.location.origin }/images/loaders/placeholder.gif`);
// Move cursor to right side of image (easier to continue typing)
this.quill.setSelection(range.index + 1);
const res = await apiPostNewsImage(formData); // API post, returns image location as string e.g. 'http://www.example.com/images/foo.png'
// Remove placeholder image
this.quill.deleteText(range.index, 1);
// Insert uploaded image
this.quill.insertEmbed(range.index, 'image', res.body.image);
}
}
// Initialize quill
var quill = new Quill('#editor', {
theme: 'snow',
modules: {
toolbar: '#toolbar',
handlers: {
image: imageHandler,
}
}
});
当我打开哪里出错时,它会从quill.js中给我这部分代码
{
key: 'addModule',
value: function addModule(name) {
var moduleClass = this.quill.constructor.import('modules/' + name);
this.modules[name] = new moduleClass(this.quill, this.options.modules[name] || {});
return this.modules[name];
}
我不确定是否做错了某些东西,或者在主轴上是否有问题。
答案 0 :(得分:0)
最初我也遇到此错误,但是我通过以下方式更改模块结构来解决了该问题:
modules: {
toolbar: {
container: '#toolbar',
handlers: {
image: imageHandler
}
}
}
请注意,处理程序现在是在工具栏内定义的,而不是在工具栏旁边定义的(有关文档,请参见https://quilljs.com/docs/modules/toolbar/)。