最近需要开发富文本编辑器中插入下拉框的组件，找遍全网只有一篇文章提供了富文本插入下拉框的解决方案，但是使用的是vue2，我也是我把它转成了vue3。quill-pro-vue3
因为原项目使用的是quill 1.3.7，但是现在浏览器已经废弃DOMNodeInserted事件，我目前的解决方案是mutation-events-polyfill。现在quill已经退出2.x版本，有能力的大佬可以升级到2.x版本
还有一个问题就是目前项目使用的监听事件检查用户是否点击编辑器的空白区域，然后强制将光标移动到编辑器最后的位置，但是会有零点几秒的延迟。
quill.root.addEventListener('click', (e) => {
// 获取编辑器内容
const delta = quill.getContents();
const length = quill.getLength();
// 计算最后一个文本内容的位置
let lastTextPosition = 0;
delta.ops.forEach(op => {
if (typeof op.insert === 'string' && op.insert.trim() !== '') {
lastTextPosition += op.insert.length;
} else if (typeof op.insert === 'object') {
lastTextPosition += 1;
}
});
// 获取最后一个位置的边界框
const lastBounds = quill.getBounds(lastTextPosition);
// 获取点击位置相对于编辑器的坐标
const clickY = e.clientY - quill.root.getBoundingClientRect().top;
const clickX = e.clientX - quill.root.getBoundingClientRect().left;
// 判断点击是否在最后一个内容之后的空白区域
if (clickY > lastBounds.bottom ||
(clickY > lastBounds.top && clickX > lastBounds.right)) {
// 设置光标到最后
setTimeout(() => {
quill.setSelection(lastTextPosition, 0);
}, 0);
}
});
上面两个问题不在意可以直接使用，有能力的大佬可以升级到quill2.x解决，如果解决了求call，感谢
