在 EasyMDE（基于 CodeMirror）中自定义粘贴逻辑时，若直接监听 DOM paste 事件并调用 replaceSelection，易因事件触发时机与底层机制冲突导致内容重复；正确做法是使用 CodeMirror 原生的 "paste" 事件监听器，确保拦截彻底且插入可控。
在 easymde/codemirror 中自定义粘贴逻辑时，若直接监听 dom `paste` 事件并调用 `replaceselection`，易因事件触发时机与底层机制冲突导致内容重复；正确做法是使用 codemirror 原生的 `"paste"` 事件监听器，确保拦截彻底且插入可控。
EasyMDE 封装了 CodeMirror 编辑器，其内部已注册默认的粘贴处理逻辑。当你在编辑器容器元素（如 getWrapperElement()）上手动添加原生 paste 事件监听器时，CodeMirror 的默认粘贴行为并未被禁用——它仍会在事件冒泡后执行，而你的自定义逻辑又额外插入了一次转换后的内容，从而造成“原始 HTML 内容 + Markdown 转换内容”的双重显示。
根本原因在于：event.preventDefault() 在 DOM 级 paste 监听器中虽能阻止浏览器默认粘贴，但无法阻止 CodeMirror 自身绑定的、更深层的粘贴处理器。CodeMirror 的 on("paste") 是其编辑器实例提供的语义化钩子（hook），它在默认行为执行前触发，并允许你通过 event.preventDefault() 真正中断整个粘贴流程。
✅ 正确实现方式如下：
// ✅ 推荐：使用 CodeMirror 实例的原生 paste 事件
mde.codemirror.on("paste", function (cm, event) {
event.preventDefault(); // ← 此处可真正阻止 CodeMirror 默认粘贴
const clipboardData = event.clipboardData || window.clipboardData;
const html = clipboardData.getData("text/html");
// 安全兜底：若无 HTML 数据，尝试纯文本
const text = clipboardData.getData("text/plain");
const markdown = html ? turndownService.turndown(html) : text;
// 在光标位置精准插入转换后的内容
cm.replaceSelection(markdown);
});
⚠️ 注意事项：
- 不要混用
addEventListener("paste")和codemirror.on("paste")，否则极易引发重复触发； -
turndownService.turndown()对空或非法 HTML 输入可能抛错，建议添加 try-catch 或预校验； - 若需保留换行/缩进等格式细节，可配合
cm.getCursor()和cm.replaceRange()实现更精细控制，而非仅依赖replaceSelection； - EasyMDE v2.15+ 已支持
options.pasteHandler配置项，也可直接在初始化时声明，进一步解耦逻辑。
总结：CodeMirror 的事件系统分层明确——DOM 事件用于通用交互，而 cm.on() 提供的是编辑器上下文内的、可干预核心行为的生命周期钩子。粘贴场景必须优先使用后者，才能确保 preventDefault() 生效、避免竞态与重复，最终实现「只插入一次、且仅为你期望的 Markdown 内容」的目标。
