wangEditor
wangEditor copied to clipboard
建议增加 移除自定义菜单或者自定义插件方法
功能描述
编辑器工具栏中需要增加几个按钮,通过插件的形式实现。根据不同场景动态注册。其中一个场景是 插件按钮点开后有一个弹窗,弹窗内部可输入内容,点击确定后需要将内容回填到 编辑器中。 所以也不能将按钮注册到全局。 目前这样一热更新就会报 重复注册 key 的错误。整个编辑器都无法渲染。

也尝试过给 Boot 添加标识,注册后则不再注册。但是热更新后原先注册插件的函数好像是被回收了。导致点击后没有效果。
if (Boot.install && Boot.install.has("openVoucher")) {
console.log(Boot.install, "install");
return;
}
Boot.registerMenu({
key: "openVoucher",
factory() {
return new OpenVoucher({
click: (editor) => {
editorRef.value = editor;
openFieldDialog("content");
},
});
},
});
const plugin = Boot.install || (Boot.install = new Set());
plugin.add("openVoucher");
提炼几个功能点
- 功能1 给出对应卸载 自定义插件
- 功能2 在卸载实例的时候卸载局部注册的 插件
- 功能3
原型图
涉及到 UI 改动的功能,请一定提供原型图。原型图能表明功能即可,不要求规范和美观
可参考的案例
是否已有可参考的案例(如其他编辑器),有的话请给出链接
我也想建议。
附议
附议附议
注册的方法是静态的,也就意味着没办法反注册了。。。。
想取消内置的image,自己写module,结果发现完全没办法这样干
2023了,有解决方法吗
试试正常注册,然后直接catch住异常
还没解决呢, 这个注册的自定义工具栏 无法销毁
试试正常注册,然后直接catch住异常
只能这样了, 至少不报红了, 报红真的受不了
我是注册前先判断了下原来存不存在这个自定义菜单
var keys = this.editor.getAllMenuKeys(); console.log(keys); // 如果不存在就注册 if (!keys.includes('自定义菜单的key')) { // 注册逻辑 }
但是还存在一个问题,点击菜单时触发的函数 原来注册的时候是直接引用的当前vue组件中的this.xxxx() 页面关闭后,组件销毁了,但是这个注册的菜单的处理函数还是指向的上一个vue实例,导致功能不能正常使用 所以这个处理函数注册的时候改成发布订阅模式了
我已经弃坑了,跑CKEditor5去了。。。
我之前解决的办法是在插入之前判断插件是否存在,存在就停止注册 if (Boot?.plugins && Boot.plugins.find(item => item?.name === '注册插件的函数名')) return;