富文本编辑器中如何实现表格单元格的合并功能？

珍珍提问于 2026-02-26 17:08:20 阅读 16

组件

我在用 Quill 开发一个富文本编辑器，现在需要支持表格的单元格合并（比如合并两列或两行），但官方好像没提供这个功能。我试过自己监听选区然后修改 DOM，结果一操作就导致编辑器内容错乱或者光标位置异常。

有没有人做过类似的功能？是不是得用自定义 blot 来实现？我现在卡在这儿了，不知道从哪下手。

比如我想合并两个相邻的 <td>，直接改 HTML 肯定不行，因为 Quill 会重新渲染覆盖掉。那正确的做法应该是怎样的？

我来解答赞 3 收藏

反馈

1 条解答

轩辕钰莹 Lv1

懒人方案：别碰 Quill 原生表格，直接上 quill-table 模块，它已经处理好了合并、边框、光标这些坑，比自己写 blot 省事一百倍。

import Table from 'quill-table';



Quill.register('modules/table', Table);



const quill = new Quill('#editor', {

  modules: {

    table: true

  },

  theme: 'snow'

});

合并单元格直接用模块自带的按钮或 API：quill.getModule('table').mergeCells(selection)，选中区域自动合并，不会崩光标。

2026-02-26 17:09