表格

插件信息

增强表格功能为 Univer Docs 提供了丰富的表格编辑能力,包括单元格样式、边框自定义、行列操作和数据填充。

介绍

在 Univer Docs 中,增强表格使您能够:

  • 以编程方式插入表格:创建指定尺寸的表格。
  • 操作结构:添加、删除和移动行列。
  • 样式单元格:应用边框、背景和文本格式。
  • 合并和拆分单元格:组合单元格以实现复杂布局。

插件模式

安装

Shell
pnpm add @univerjs-pro/docs-table @univerjs-pro/docs-table-ui

使用

TypeScript
import { UniverDocsTablePlugin } from '@univerjs-pro/docs-table'import { UniverDocsTableUIPlugin } from '@univerjs-pro/docs-table-ui'import DocsTableUIZhCN from '@univerjs-pro/docs-table-ui/locale/zh-CN'import { LocaleType, mergeLocales, Univer } from '@univerjs/core'import '@univerjs-pro/docs-table-ui/lib/index.css'const univer = new Univer({  locale: LocaleType.ZH_CN,  locales: {    [LocaleType.ZH_CN]: mergeLocales(      DocsTableUIZhCN,     ),  },})univer.registerPlugin(UniverDocsTablePlugin)univer.registerPlugin(UniverDocsTableUIPlugin)

如果您拥有 Univer 商业许可证,请参阅在客户端使用许可证进行配置。

移动端适配

先配置移动端编辑器。在本页插件模式的初始化代码中,将下列桌面端注册替换为同一个包导出的移动端插件,并在打开文档前完成。保留模型插件、样式、语言包和 Facade 导入,不要同时注册两个版本。

来源包桌面端注册移动端注册
@univerjs-pro/docs-table-uiUniverDocsTableUIPluginUniverDocsTableMobileUIPlugin

Facade API

使用 API 前请确保已导入 facade:

TypeScript
import '@univerjs-pro/docs-table/facade'

插入表格

TypeScript
const doc = univerAPI.getActiveDocument()const table = doc?.insertTable(3, 4, { tableId: 'my-table' })table?.setCellText(0, 0, 'Name')

从数据插入表格

TypeScript
const doc = univerAPI.getActiveDocument()doc?.insertTableFromData([  ['Name', 'Status'],  ['Facade', 'Ready'],], { headerRowCount: 1 })

获取所有表格

TypeScript
const doc = univerAPI.getActiveDocument()const tables = doc?.getTables() ?? []

删除表格

TypeScript
const doc = univerAPI.getActiveDocument()doc?.deleteTable('my-table')

表格边框

选中表格或其中的单元格后,可在表格上下文选项卡中使用边框选择器。它提供全部、外侧、内部、单侧与无边框预设,并可调整边框颜色、粗细和线型。这些控件由 UniverDocsTableUIPlugin 提供。

编辑、撤销与协同

表格 Facade 的设置方法和结构编辑通过文档命令执行,参与撤销、重做和协同。setTableStyle() 将背景与边框修改合并为一条历史记录。setColumnType() 同样支持撤销和同步,列类型随列移动。setCellText() 替换整个单元格值,并发替换按原子值冲突规则处理,普通逐字编辑仍使用文本 OT。锁定内容控件拒绝的单元格编辑返回 false,且不消耗撤销/重做历史。

表格整体对齐

在传统文档中选中表格,通过 Ribbon 的“表格 → 表格对齐”将整个表格在页面正文区域内左对齐、居中或右对齐。这会改变表格的位置,不会改变单元格内文字的对齐方式。现代文档中该控件不可用。

对齐值保存在 tableSource[tableId].align 中,支持撤销、重做和保存。注册表格插件后,也可以执行下面的公开命令,tableId 使用文档快照中已有的表格 ID。目标无效、文档被禁用或属于现代文档时返回 false。

TypeScript
import { DocsTableSetTableAlignCommand } from '@univerjs-pro/docs-table'import { TableAlignmentType } from '@univerjs/core'const aligned = await univerAPI.executeCommand(DocsTableSetTableAlignCommand.id, {  unitId: documentId,  tableId,  value: TableAlignmentType.CENTER,})

你觉得这篇文档如何?

© 2026 DreamNum Co., Ltd.