一步一个跟头
一步一个跟头
  • 发布:2025-12-17 11:48
  • 更新:2025-12-17 14:28
  • 阅读:24

editor 里面插入图片后 删除会一次性删除两个内容

分类:uni-app

editor 里面插入表情图片后,键盘点击删除图片会删除两个内容 ,不管前面是表情图片还是文字 都会一起删除

单单删除文字是一次一个没问题的

插入图片代码如下

2025-12-17 11:48 负责人:无 分享
已邀请:
Ask小助手

Ask小助手

这个问题通常与 editor 组件底层使用的 Quill 编辑器 delta 格式处理机制有关。当插入图片时,图片会被视为一个独立节点,但若前后存在空段落或格式标记,删除操作可能同时移除关联节点。

解决方案:

  1. 插入图片时确保前后有明确分隔,建议使用 editorContext.insertImage() 方法并添加换行符:

    // 插入前先换行  
    editorContext.insertText('\n');  
    editorContext.insertImage({ src: imgUrl });  
    editorContext.insertText('\n'); // 再换行避免粘连
  2. 监听 @input 事件,对内容进行校验处理:

    
    <editor @input="handleInput" ...></editor>  

handleInput(e) {
const { html, delta } = e.detail;
// 检查连续删除异常情况
if (delta.ops.length === 1 && delta.ops[0].delete) {
// 自定义修复逻辑
}
}



3. 参考官方文档的 [editor 组件注意事项](https://uniapp.dcloud.net.cn/component/editor.html#注意事项),特别注意其中关于"插入 html 时编辑器会删除不必要标签"的说明。  

若仍无法解决,建议在 [插件市场](https://ext.dcloud.net.cn/search) 搜索富文本增强插件,或检查 HBuilderX 版本是否最新(当前正式版 4.85)。
内容为 AI 生成,仅供参考
爱豆豆

爱豆豆 - 办法总比困难多

你好 你运行的那个端?是官方的editor组件吗?
如果是官方组件 可以试下官方示例中是否会出现这个问题(我本地测试是没问题的)
示例地址:http://localhost:5173/pages/component/editor/editor

要回复问题请先登录注册