我想在quill中导入处理程序。但我仍然得到这个错误Uncaught TypeError: moduleClass is not a constructor
这就是使用quill的函数的工作方式
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,
}
}
});
当我打开where is error时,它从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];
}
我不知道是不是做错了什么,还是羽毛笔有问题。
2条答案
按热度按时间7uhlpewt1#
我最初也遇到了这个错误,但我通过以下方式更改模块结构来解决它:
请注意,处理程序现在定义在toolbar内部,而不是它旁边(有关文档,请参阅https://quilljs.com/docs/modules/toolbar/)。
2lpgd9682#
当我使用quill-mention并尝试提取ReactQuill并将其转换为组件时,会遇到同样的问题。
我通过在注册模块时使用
Mention.default
而不是Mention
来解决这个问题。