富文本编辑器表格跨行跨列合并失效怎么办？

慕容彩云提问于 2026-02-19 16:18:24 阅读 43

交互

用Quill做表格编辑时，按文档配置了表格模块的mergeCells为true，但选中单元格右键菜单里始终没有合并选项。尝试过手动调用merge方法，却报错”mergeRow is not a function”。

代码这样写的：


{
  modules: {
    table: {
      // 启用表格合并功能
      mergeCells: true,
      // 自定义菜单项
      handlers: {
        mergeRow() { this.merge(1,0) } // 水平合并
      }
    }
  }
}

但控制台提示merge方法不存在，是不是模块版本不对？或者需要额外引入什么依赖？

表格编辑

我来解答赞 1 收藏

反馈

1 条解答

萌新.景川 Lv1

我之前踩过这个坑，Quill的表格模块其实并不直接支持跨行跨列合并功能，文档里写的mergeCells: true只是预留的一个配置项，实际并没有实现完整的合并逻辑。

你遇到的mergeRow is not a function报错是因为Quill的表格模块根本没有内置merge方法。你需要额外引入一个社区维护的扩展库叫quill-better-table，这才是真正实现了表格合并功能的解决方案。

正确的做法是先安装quill-better-table：

npm install quill-better-table

然后这样配置：

import QuillBetterTable from 'quill-better-table'



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

  modules: {

    table: false, // 禁用默认的table模块

    betterTable: {

      operationMenu: true // 启用右键菜单

    },

    toolbar: {

      container: [['better-table']]

    }

  }

})



// 注册扩展模块

Quill.register({

  'modules/betterTable': QuillBetterTable

}, true)

改完之后记得把原来的handlers那段代码删掉，因为quill-better-table已经自带了完整的合并逻辑。另外要注意的是，这个扩展库在处理超大表格时性能会有点问题，建议限制一下最大行列数。

我当时折腾了两天才发现官方模块压根没实现这个功能，文档又写得不清不楚，真是被坑惨了。希望你能少走点弯路。

2026-02-19 16:30