---
title: "TableKit 扩展"
description: "一个扩展包含所有必要的表格扩展，使用 TableKit。非常适合快速在 Tiptap 中设置表格。更多详细信息请查看文档！"
canonical_url: "https://tiptap.zhcndoc.com/editor/extensions/functionality/table-kit"
---

# TableKit 扩展

一个扩展包含所有必要的表格扩展，使用 TableKit。非常适合快速在 Tiptap 中设置表格。更多详细信息请查看文档！

`TableKit` 是所有必要的 Tiptap 表格扩展的集合。如果您想快速在 Tiptap 中设置表格，这个扩展非常适合您。

> **Interactive demo:** [Table](https://embed.tiptap.dev/preview/Nodes/Table)

## 安装

```bash
npm install @tiptap/extension-table
```

## 包含的扩展

### 节点

- [`Table`](https://tiptap.zhcndoc.com/editor/extensions/nodes/table.md)
- [`TableCell`](https://tiptap.zhcndoc.com/editor/extensions/nodes/table-cell.md)
- [`TableHeader`](https://tiptap.zhcndoc.com/editor/extensions/nodes/table-header.md)
- [`TableRow`](https://tiptap.zhcndoc.com/editor/extensions/nodes/table-row.md)

## 源代码

[packages/extension-table/](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-table/)

## 使用 TableKit 扩展

将 `TableKit` 传递给编辑器，以一次加载所有包含的扩展。

```js
import { Editor } from '@tiptap/core'
import { TableKit } from '@tiptap/extension-table'

const editor = new Editor({
  extensions: [TableKit],
})
```

您可以配置包含的扩展，甚至可以禁用其中一些，如下所示。

```js
import { Editor } from '@tiptap/core'
import { TableKit } from '@tiptap/extension-table'

const editor = new Editor({
  extensions: [
    TableKit.configure({
      // 禁用一个扩展
      tableRow: false,

      // 配置一个扩展
      tableCell: {
        HTMLAttributes: { class: 'list-item' },
      },
    }),
  ],
})
```