经测试，开启 sanitize: false 关闭 XSS 转义后，bug 仍然存在，表现为“即时渲染”模式无法对 HTML 标签渲染。

例如：

1、“分屏模式”输入以下代码实现 a 的 2 次方。

a<sup>2</sup>

切换到“即时渲染”模式后，显示的是 a2，而不是 a 的 2 次方。

2、“所见即所得”模式下插入表格，在单元格内回车换行，然后把编辑器转换成“即时渲染”模式后，换行符被过滤了，整个单元格变成非常一整行超长文本，顶破了屏幕，“所见即所得”模式下的排版被打乱。

建议无论 ir、sv、wysiwyg 哪种编辑模式，全部统一转换成中间层代码并提交到后端持久化；从后端取回时，也是取回中间层代码到客户端，客户端再根据本地的渲染模式，对中间层代码进行转换并加载到编辑器中。

老板可能是为了防 XSS 攻击所以对 HTML 标签做了一些特殊处理过滤转义之类的，我不太清楚有没有完美的方案既可以防 XSS，又可以完美在三种编辑模式下来回无损切换（原则上应该可以解决这个问题）。

如果实在搞不定的话，至少应该给用户一个 option 选项是否开启防 XSS、转义这些功能。vditor 如果作为发布在公网论坛上的编辑器，确实要启用转义、过滤那些防 XSS 的功能；但是作为个人用户，我的应用只在单机使用，根本不涉及 XSS 那些问题，相比之下我更关注排版好不好用、能否无损切换这些问题，所以加个选项把选择权交给用户最好了。

自己又解决了 😂

加个监听器：

document.getElementById('content').addEventListener('click', function (event) {
      if (event.target.tagName === 'IMG') {
        Vditor.previewImage(event.target, 'zh_CN', document.getElementById('outline').classList.contains('dark') ? 'dark' : 'classic')
      } else if (event.target.tagName === 'A') {
        event.target.setAttribute('target', '_blank')
      }
    })

自己解决了：修改_toolbar.scss 中的&--pin 样式，删掉 position: sticky 属性