# @\_ueberdosis/prosemirror-tables 中文文档

规范地址：https://npmcn.com/package/%40_ueberdosis/prosemirror-tables/

版本：1\.1\.3
npm 元数据更新时间：2022-06-24T12:41:29.840Z
中文译文更新时间：2026-11-06T00:47:09.953Z
软件包许可：MIT

本文由上游 README 翻译，可能存在偏差，请结合原文核对 API、命令与配置。版权与许可归原作者所有。

原始 npm 页面：https://www.npmjs.com/package/%40_ueberdosis/prosemirror-tables
原文对照：https://npmcn.com/package/%40_ueberdosis/prosemirror-tables/?lang=original
项目主页：https://github.com/prosemirror/prosemirror-tables#readme
源码仓库：https://github.com/prosemirror/prosemirror-tables

## 关键信息（来自 npm 元数据）

- 包体积（解压后）：1 MB，34 个文件
- 模块格式：ESM + CJS
- TypeScript 类型：包内自带
- 运行依赖：5 个
- 首次发布：2022-06-24T12:41:29.316Z
- 最新版本发布：2022-06-24T12:41:29.643Z
- 近 30 天下载量：7850（2026-10-05 至 2026-11-03，npm 官方下载统计）
- 已发布版本数：1（近 12 个月 0 个）

## 中文简介

ProseMiror 的行/ Colspan 表格组件, 并有 ES6 支持

## 安装

```sh
npm install @_ueberdosis/prosemirror-tables
```

也可以使用：`pnpm add @_ueberdosis/prosemirror-tables`、`yarn add @_ueberdosis/prosemirror-tables`、`bun add @_ueberdosis/prosemirror-tables`

## README

**注:这个包件与\[ProseMirror/prosemiror-tables\]上的包件几乎完全相同 (单位:千美元)[https://github.com/ProseMiror/prosemiror-tables (中文(简体) )](https://github.com/ProseMirror/prosemirror-tables)),但该建筑已经 调整为使用 Bail 而不是 bulle 的转接器,现在应该是 ES6 兼容的.**

# ProseMiror 表格模块

本模块定义了用于支持表格的系统扩展 行/ colspan 支持, 单元格选择自定义选择类 在这样的表格中,用于管理和执行此类选择的插件 这些表格的变数,以及一些可与之合作的命令 图表.

顶级目录包含 `demo.js` 财务报告和审定财务报表 `index.html`,哪个 可用 `yarn build_demo` 以演示 可使用模块.

## 文档

模块主文件输出出所有您需要与之合作的东西. 你可能想做的第一件事就是 创建一个桌子 计划 就这样 `tableNodes` 用于:

-   **`tableNodes`**`(options: Object) → Object`  
    此函数创建一组 [节点 规格](http://prosemirror.net/docs/ref/#model.SchemaSpec.nodes) 页:1 `table`, (中文(简体) ), `table_row`,以及 `table_cell` 此操作所用的节点类型 模块。 然后,当 创建一个计划.
    
    -   **`options`**`: Object`  
        理解如下:
        
        -   **`tableGroup`**`: ?string`  
            组名( 比如 `"block"`添加到表格中 节点类型.
            
        -   **`cellContent`**`: string`  
            表格单元格的内容表达式.
            
        -   **`cellAttributes`**`: ?Object`  
            要添加到单元格中的额外属性 。 地图属性名称为 具有下列属性的对象:
            
            -   **`default`**`: any`  
                属性的默认值 .
                
            -   **`getFromDOM`**`: ?fn(dom.Node) → any`  
                从 DOM 节点读取属性值的函数 .
                
            -   **`setDOMAttr`**`: ?fn(value: any, attrs: Object)`  
                将属性值添加到属性中的函数 用于制造细胞DOM的物体.
                
-   **`tableEditing`**`() → Plugin`  
    创建一个 [插件](http://prosemirror.net/docs/ref/#state.Plugin) ,当添加到编辑器中时,允许单元格选择,处理 基于单元格的复制/粘贴,并确保表格保持良好的结构(每个表格) 行的宽度相同,单元格不相重叠.
    
    您可能应该把这个插件放在您的数组的末尾 插件,因为它处理表格中的鼠标和箭头关键事件 相当宽泛,以及其它插件,例如空白光标或 列宽拖曳插件,可能想要先翻转到 进行更具体的行为.
    

### 类 单元格选择扩展选择

A 类 [`Selection`](http://prosemirror.net/docs/ref/#state.Selection) 子类,代表横跨表格部分内容的单元格选择. 启用插件后, 用户会创建这些插件 选择跨单元格,然后通过给选定的单元格一个 `selectedCell` CSS课.

-   `new` **`CellSelection`**`($anchorCell: ResolvedPos, $headCell: ?ResolvedPos = $anchorCell)`  
    表格选择由其锚和头单元格确定。 这个 给予该建筑师的职位应标明 _在此之前_ 两个 同一表格中的单元格。 他们可能是一样的,选择一个 电话.
    
-   **`$anchorCell`**`: ResolvedPos`  
    确定的立场 _在前面_ 锁定单元格(一个) 这在扩展选择时不会移动).
    
-   **`$headCell`**`: ResolvedPos`  
    指向头部牢房(即 在扩展选择时移动).
    
-   **`content`**`() → Slice`  
    返回含有所选表格行的长方形片段 细胞.
    
-   **`isColSelection`**`() → bool`  
    如果选择从头到尾都是真实的 桌子底边.
    
-   **`isRowSelection`**`() → bool`  
    如果选择从左到右 在桌子右边.
    
-   `static` **`colSelection`**`($anchorCell: ResolvedPos, $headCell: ?ResolvedPos = $anchorCell) → CellSelection`  
    返回覆盖给定锚的最小列选择 和头部细胞.
    
-   `static` **`rowSelection`**`($anchorCell: ResolvedPos, $headCell: ?ResolvedPos = $anchorCell) → CellSelection`  
    返回覆盖给定锚的最小行选择 和头部细胞.
    
-   `static` **`create`**`(doc: Node, anchorCell: number, headCell: ?number = anchorCell) → CellSelection`
    

### 图标

以下命令可用于制作表格编辑功能 可供用户使用.

-   **`addColumnBefore`**`(state: EditorState, dispatch: ?fn(tr: Transaction)) → bool`  
    命令在选择的列前添加一列.
    
-   **`addColumnAfter`**`(state: EditorState, dispatch: ?fn(tr: Transaction)) → bool`  
    命令在选择的列后添加一列.
    
-   **`deleteColumn`**`(state: EditorState, dispatch: ?fn(tr: Transaction)) → bool`  
    从表格中删除所选列的命令函数.
    
-   **`addRowBefore`**`(state: EditorState, dispatch: ?fn(tr: Transaction)) → bool`  
    选择前添加一个表格行.
    
-   **`addRowAfter`**`(state: EditorState, dispatch: ?fn(tr: Transaction)) → bool`  
    选择后添加一行表格.
    
-   **`deleteRow`**`(state: EditorState, dispatch: ?fn(tr: Transaction)) → bool`  
    从表格中删除所选行.
    
-   **`mergeCells`**`(state: EditorState, dispatch: ?fn(tr: Transaction)) → bool`  
    将选定的单元格合并为一个单元格。 仅在 选定单元格的大纲构成矩形.
    
-   **`splitCell`**`(state: EditorState, dispatch: ?fn(tr: Transaction)) → bool`  
    拆分一个选定的单元格,其行板或相框大于一个, 进入较小的细胞。 对新单元格使用第一个单元格类型.
    
-   **`splitCellWithType`**`(getType: fn({row: number, col: number, node: Node}) → NodeType) → fn(EditorState, dispatch: ?fn(tr: Transaction)) → bool`  
    拆分一个选定的单元格,其行板或相框大于一个, 转换为小单元格,单元格类型(th, td)由 getType 函数返回.
    
-   **`setCellAttr`**`(name: string, value: any) → fn(EditorState, dispatch: ?fn(tr: Transaction)) → bool`  
    返回将给定属性设定为给定值的命令, ,并且只有在当前选中的单元格不可用时才可用 已经将属性设定为该值.
    
-   **`toggleHeaderRow`**`(EditorState, dispatch: ?fn(tr: Transaction)) → bool`  
    切换选中行是否包含页眉单元格.
    
-   **`toggleHeaderColumn`**`(EditorState, dispatch: ?fn(tr: Transaction)) → bool`  
    切换选中的列是否包含标题单元格.
    
-   **`toggleHeaderCell`**`(EditorState, dispatch: ?fn(tr: Transaction)) → bool`  
    切换选定单元格是否为标题单元格.
    
-   **`toggleHeader`**`(type: string, options: ?{useDeprecatedLogic: bool}) → fn(EditorState, dispatch: ?fn(tr: Transaction)) → bool`  
    在行/列标题和普通单元格之间切换(仅适用于一行/列). 对于堕落的行为通过 `useDeprecatedLogic` 以真实的选项.
    
-   **`goToNextCell`**`(direction: number) → fn(EditorState, dispatch: ?fn(tr: Transaction)) → bool`  
    返回用于选择下一个(方向=1)或上一个的命令 (方向=-1)表格中的单元格.
    
-   **`deleteTable`**`(state: EditorState, dispatch: ?fn(tr: Transaction)) → bool`  
    删除选定的表格.
    

### 公用事业

-   **`fixTables`**`(state: EditorState, oldState: ?EditorState) → ?Transaction`  
    检查给定状态文档中的所有表格并返回 a 交易,必要时可以修正它们。 若为 `oldState` 曾经 前提是,这被认为是 保持之前,已知良好状态, 用于避免重新扫描 文档.

### 类表映射

一张表格图描述了某一表格的构造。 为了避免 重新计算它们时,它们会被每个表格节点缓存. 改为: 在地图中保存的位置相对于 开始表格,而不是开始文档.

-   **`width`**`: number`  
    表格的宽度
    
-   **`height`**`: number`  
    桌子的身高 高点
    
-   **`map`**`: [number]`  
    宽度 \* 高度阵列, 起始位置为 每个槽中覆盖表格该部分的单元格
    
-   **`findCell`**`(pos: number) → Rect`  
    在给定位置查找单元格的尺寸 .
    
-   **`colCount`**`(pos: number) → number`  
    在指定位置找到单元格左侧 .
    
-   **`nextCell`**`(pos: number, axis: string, dir: number) → ?number`  
    从单元格开始查找给定方向的下一个单元格 时间 `pos`如果有的话.
    
-   **`rectBetween`**`(a: number, b: number) → Rect`  
    让矩形横跨两个给定的细胞.
    
-   **`cellsInRect`**`(rect: Rect) → [number]`  
    返回所有左上角单元格的位置 给定矩形.
    
-   **`positionAt`**`(row: number, col: number, table: Node) → number`  
    返回单元格在给定行和列的位置 如果一个单元格在那里启动,则启动或将启动.
    
-   `static` **`get`**`(table: Node) → TableMap`  
    查找给定的表格节点的表格地图.

## 常见问题

### @\_ueberdosis/prosemirror-tables 是什么？

ProseMiror 的行/ Colspan 表格组件, 并有 ES6 支持

### 如何安装 @\_ueberdosis/prosemirror-tables？

在项目目录运行 npm install @\_ueberdosis/prosemirror-tables，或使用 pnpm add / yarn add / bun add。

### @\_ueberdosis/prosemirror-tables 支持 TypeScript 吗？

支持。包内自带 TypeScript 类型声明（package\.json 声明了 types 入口），安装后即可获得类型提示，无需再安装 @types 包。

### @\_ueberdosis/prosemirror-tables 支持 ESM 还是 CommonJS？

同时提供 ES Module 与 CommonJS 入口，import 和 require\(\) 都可以使用，打包工具会自动选择合适的版本。

### @\_ueberdosis/prosemirror-tables 可以商用吗？

@\_ueberdosis/prosemirror-tables 使用 MIT 许可。宽松许可：允许商业使用、修改和再分发，通常只需在分发时保留原版权与许可声明。以上为概括，不构成法律意见，请以许可原文为准。

### @\_ueberdosis/prosemirror-tables 的下载量有多少？

根据 npm 官方下载统计，@\_ueberdosis/prosemirror-tables 在 2026/10/05 – 2026/11/03 这 30 天内被下载 7,850 次，日均约 262 次。下载量会把 CI 构建、镜像同步和作为其他包依赖的安装一并计入，适合横向比较热度，不能直接等同于使用人数。

### @\_ueberdosis/prosemirror-tables 还在维护吗？

最新版本 1\.1\.3 发布于 2022/06/24（4 年前）；至今共发布 1 个版本，其中过去 12 个月发布了 0 个；首次发布于 2022/06/24。发布频率只是参考信号：功能稳定的工具可能很少需要更新，建议结合源码仓库的 issue 和提交记录判断。