
univerjs/sheets 包源码深度解析Univer 表格核心数据模型与业务逻辑层【免费下载链接】univerUniver is a full-stack framework for creating and editing spreadsheets / word processor / presentation on both web and server.项目地址: https://gitcode.com/GitHub_Trending/un/univer本文围绕univerjs/sheets包即 Univer 仓库 packages/sheets 目录展开讲解该包在 Univer 全栈表格体系中的定位、安装注册方式、核心配置项、导出 API 结构以及背后的服务与命令架构。读完本文你将掌握如何在项目中安装并注册UniverSheetsPlugin、如何理解其「与 UI 无关的核心层」设计、如何按需配置IUniverSheetsConfig各开关以及如何通过 Facade 门面 API 在业务代码中操作工作簿与工作表。univerjs/sheets是 Univer 表格能力的「心脏」它提供电子表格的核心数据模型Workbook / Worksheet / Cell 体系与全部业务逻辑但刻意与 UI 层解耦——本身不输出任何 CSS也不依赖任何前端框架组件。这意味着同样的核心逻辑既可以跑在浏览器主线程、Web Worker也可以跑在 Node.js 服务端。它同时提供 Locale 文本与 Facade 门面入口是上层 UI 包如univerjs/sheets-ui、预设包如univerjs/preset-sheets-core以及服务端计算场景共同依赖的基础。包概览一张表看懂包属性原文档在 Package Overview 一节给出了该包的元信息结合仓库 package.json 可以补充确认如下属性值说明依据包名univerjs/sheets见 package.json 的name字段UMD 全局变量UniverSheets由univer-cli build打包时声明见 package.jsonscripts.build:bundleCSS无该包是纯逻辑层样式由 UI 包负责Locales有见 packages/sheets/src/locale共 20 个语言文件Facade 入口有见 packages/sheets/src/facade当前版本1.0.0-beta.2见 package.json 的version字段许可证Apache-2.0见 package.json 的license字段从 package.json 的依赖声明可以看到它的位置它依赖univerjs/coreDI 容器、Univer 实例、Workbook 数据模型、univerjs/engine-formula公式引擎、univerjs/engine-render渲染引擎、univerjs/protocol通信协议与univerjs/rpc跨端调用并将rxjs作为 peerDependency7.0.0。这解释了为什么它能够在无 UI的环境下独立完成数据管理与计算——它直接站在核心与公式引擎之上。安装pnpm / npm 一行搞定原文档的 Installation 一节给出了两种安装方式这里补充版本一致性说明pnpm add univerjs/sheets # 或 npm install univerjs/sheets安装后有一条硬性约束保持所有univerjs/*包处于同一版本。这一点至关重要因为 Univer 的包之间通过workspace:*精确锁定依赖关系见 package.json 的dependencies字段如果univerjs/sheets与univerjs/core版本不一致可能会导致 DI 类型不匹配或行为异常。由于该包不包含 CSS安装后无需额外引入样式文件——这与需要额外import univerjs/sheets-ui/lib/index.css的 UI 包形成鲜明对比也是它适合服务端 / Worker 场景的原因之一。使用注册插件 合并 Locale原文档的 Usage 一节给出了最小接入代码下面结合仓库源码给出完整可运行的形态。第一步注册UniverSheetsPluginimport { Univer } from univerjs/core; import { UniverSheetsPlugin } from univerjs/sheets; const univer new Univer(); univer.registerPlugin(UniverSheetsPlugin);在 plugin.ts 中UniverSheetsPlugin继承了核心框架的Plugin基类并声明了以下静态元信息static override pluginName SHEET_PLUGIN; static override packageName pkg.name; // univerjs/sheets static override version pkg.version; // 1.0.0-beta.2 static override type UniverInstanceType.UNIVER_SHEET;其中type UniverInstanceType.UNIVER_SHEET表明该插件负责注册电子表格这一类型的 Univer 实例Unit对应createWorkbook创建的Workbook。同时插件类上标注了DependentOn(UniverFormulaEnginePlugin)装饰器见 plugin.ts这意味着注册UniverSheetsPlugin之前必须先注册公式引擎插件否则依赖注入会因缺失univerjs/engine-formula提供的服务而失败。这是从源码可以直接确认的依赖契约。第二步合并 Locale 文本原文档提到当该包贡献 UI 文本时将 EnUS 合并进你的 Univer locale mapimport EnUS from univerjs/sheets/locale/en-US; import { UniverSheetsPlugin } from univerjs/sheets; univer.registerPlugin(UniverSheetsPlugin); // 将 EnUS 合并进 Univer 的 locale map本包贡献了部分 UI 文本时 univer.registerLocale(enUS, EnUS);./locale/*子路径由 package.json 的exports字段显式声明./locale/*: ./src/locale/*.ts因此可以安全地按需引入单个语言文件。虽然该包本身不渲染 UI但它仍为合并单元格、区域保护、自动填充等功能提供了命令执行失败时的提示文案——例如 en-US.ts 中的overlappingSelectionsCannot use that command on overlapping selections、acrossMergedCellAcross a merged cell以及一整套permission.dialog保护提示文本。因此原文档特别强调当此包贡献 UI 文本时需要合并 locale防止界面弹出英文或空文案。Locale 支持20 种语言的文本骨架从 packages/sheets/src/locale 目录可以看到该包内置了 20 个语言文件ar-SA、ca-ES、de-DE、en-US、es-ES、fa-IR、fr-FR、id-ID、it-IT、ja-JP、ko-KR、pl-PL、pt-BR、ru-RU、sk-SK、vi-VN、zh-CN、zh-HK、zh-TW外加类型定义 types.ts。每个文件是一个结构化对象按功能域组织文本。以 en-US.ts 为例顶层包含sheets.tabs工作表标签文案、sheets.info操作提示、sheets.definedName定义名称校验提示、sheets.permission保护与权限提示、sheets.autoFill自动填充选项、sheets.merge合并确认文案等分组。这些文本被命令与控制器读取用于在受保护区域被操作、合并单元格被部分选中等场景下给出准确反馈。核心配置IUniverSheetsConfig 全字段解析UniverSheetsPlugin的构造函数接受一个可选的PartialIUniverSheetsConfig配置对象默认值为空对象defaultPluginConfig {}见 config.ts。注册时可这样传参univer.registerPlugin(UniverSheetsPlugin, { onlyRegisterFormulaRelatedMutations: true, notExecuteFormula: false, isRowStylePrecedeColumnStyle: true, autoHeightForMergedCells: true, freezeSync: false, largeSheetOperation: { largeSheetCellCountThreshold: 10000, batchSize: 5000, }, });各字段的含义与源码依据如下类型定义见 config.ts配置项类型默认值作用与源码依据notExecuteFormulaboolean未设置为true时不注册CalculateResultApplyController计算结果回写控制器用于纯数据写入、由外部负责公式计算的场景。见 plugin.tsonlyRegisterFormulaRelatedMutationstrue未设置只注册与公式计算相关的 Mutation。配置后会将ONLY_REGISTER_FORMULA_RELATED_MUTATIONS_KEY置为 true并跳过ActiveWorksheetController的注册。特别适用于 Web Worker 环境或服务端计算原文档强调的场景见 plugin.ts 与 plugin.tsisRowStylePrecedeColumnStyleboolean未设置当行列样式同时设置时行样式是否优先于列样式。为true时设置IS_ROW_STYLE_PRECEDE_COLUMN_STYLE全局配置见 plugin.tsautoHeightForMergedCellsbooleanfalse是否对合并单元格启用自动行高。为true时设置AUTO_HEIGHT_FOR_MERGED_CELLS全局配置见 plugin.ts 与 config.ts 的注释freezeSyncbooleantrue实时协作时是否将冻结窗格frozen state同步给其他用户。可在运行时通过 Facade APIuniverAPI.setFreezeSync(false)动态关闭见 f-univer.tsoverrideDependencyOverride无允许覆盖插件注册的任意依赖项服务/控制器用于深度定制见 plugin.ts 的mergeOverrideWithDependencies调用largeSheetOperationILargeSheetOperationConfig{ largeSheetCellCountThreshold: 6000, batchSize: 3000 }大表操作配置见下节大表Large Sheet操作配置ILargeSheetOperationConfig是专为大工作量场景设计的子配置定义见 config.ts默认值见 config.ts字段默认值含义largeSheetCellCountThreshold6000当工作表单元格数超过该阈值即视为大表。超过后复制工作表时 Mutation 会被拆分为多个批次执行删除工作表时不再支持 undo/redobatchSize3000大表场景下拆分 Mutation 时每批处理的最大单元格数这两个参数的取舍直接影响大数据量场景的响应速度与内存占用阈值越低、批次越小单次同步的数据越少但事务拆分越多反之则吞吐更高但对单帧执行时长更敏感。对于需要处理超大数据集的表格应用建议根据实际单元格规模与网络传输能力调整。插件启动流程生命周期与依赖注册从 plugin.ts 可以完整还原插件从构造到就绪的流程这是理解该包做了什么的最佳源码入口构造函数将用户配置与defaultPluginConfig合并后写入IConfigServicekey 为SHEETS_PLUGIN_CONFIG_KEY sheets.config随后执行_initConfig()与_initDependencies()。_initDependencies()向 Injector 注册约 30 个依赖可大致分为四组服务servicesBorderStyleManagerService边框样式管理、SheetsSelectionsService选区管理、RefRangeService引用区域联动调整、NumfmtService数字格式、SheetInterceptorService单元格内容拦截器、SheetSkeletonService表格骨架缓存等控制器controllersBasicWorksheetController工作表基础操作、MergeCellController合并单元格、NumberCellDisplayController数字显示、DefinedNameDataController定义名称、SheetsFreezeSyncController冻结同步、ZebraCrossingCacheController斑马纹/交叉缓存、AutoFillController自动填充等权限permissionWorksheetPermissionService、WorksheetProtectionRuleModel、SheetPermissionInitController、SheetPermissionCheckController以及一整套范围保护Range Protection相关服务与模型选区互斥与自动填充ExclusiveRangeService互斥区域服务、AutoFillService。生命周期钩子onStarting()预热工作表操作、合并单元格、权限服务等onRendered()预热数字格式服务onReady()最后实例化活动工作表控制器、公式回写控制器、定义名称控制器、引用区域服务等。整个流程体现了注册即懒加载、按需 touchDependencies 预热的 DI 设计。导出 API命令、Mutation 与服务的完整矩阵UniverSheetsPlugin注册完毕后index.ts 向外部导出了完整的 API 面。按其类别可整理为命令Command——面向用户操作的入口几乎所有表格操作都对应一个命令类例如单元格值/样式SetRangeValuesCommand、SetStyleCommand、SetBackgroundColorCommand、SetFontSizeCommand、SetTextWrapCommand、ClearSelectionContentCommand、ClearSelectionFormatCommand行列操作InsertRowCommand/InsertColCommand/RemoveRowCommand/RemoveColCommand、SetRowHeightCommand/SetColWidthCommand、SetRowHiddenCommand/SetColHiddenCommand、MoveRowsCommand/MoveColsCommand工作表操作InsertSheetCommand/RemoveSheetCommand/CopySheetCommand、SetWorksheetNameCommand/SetWorksheetOrderCommand/SetWorksheetActivateCommand合并单元格AddWorksheetMergeCommand含 Horizontal / Vertical / All 变体、RemoveWorksheetMergeCommand引用区域操作InsertRangeMoveDownCommand/InsertRangeMoveRightCommand/DeleteRangeMoveUpCommand/DeleteRangeMoveLeftCommand/MoveRangeCommand定义名称InsertDefinedNameCommand/SetDefinedNameCommand/RemoveDefinedNameCommand冻结与显示SetFrozenCommand/CancelFrozenCommand、ToggleGridlinesCommand、SetTabColorCommand自动填充AutoFillCommand、AutoClearContentCommand、SheetCopyDownCommand、SheetCopyRightCommand。每个命令均导出配套的I...CommandParams类型便于类型安全地通过ICommandService.executeCommand调用。Mutation——数据变更的最小原子单元与命令不同Mutation 直接写数据模型且天然支持 undo/redo例如SetRangeValuesMutation、InsertRowMutation、RemoveColMutation、SetWorksheetColWidthMutation、SetWorksheetRowHeightMutation、SetFrozenMutation、AddWorksheetMergeMutation等。命令内部通常翻译为一系列 Mutation 再执行如SetRangeValuesCommand底层对应SetRangeValuesMutation这也正是 Undo/Redo 得以实现的基础撤销时反演 Mutation 序列即可。服务与控制器——编程式调用与二次开发的基础index.ts 还导出了大量可在业务中直接注入使用的服务SheetsSelectionsService选区管理。在 selection.service.ts 中暴露selectionMoveStart$/selectionMoving$/selectionMoveEnd$/selectionSet$/selectionChanged$等 RxJS 流分别对应指针按下、拖动、抬起、命令式设置与综合变化事件RefRangeService当插入/删除行列、移动区域等 Mutation 发生时自动调整其他引用区域的范围配套导出handleInsertRow、handleRemoveCol、handleMoveRange等工具函数见 index.tsSheetInterceptorService单元格内容拦截器暴露BEFORE_CELL_EDIT、AFTER_CELL_EDIT、VALIDATE_CELL等拦截点是数据校验、公式联动等扩展机制的挂载点权限体系WorksheetPermissionService、WorkbookPermissionService以及大量权限点类WorksheetEditPermission、WorksheetSetCellValuePermission、RangeProtectionPermissionEditPoint等。基础工具函数包括getSheetCommandTarget根据命令参数定位目标工作表、splitRangeText、rangeToDiscreteRange、findFirstNonEmptyCell、expandToContinuousRange、validateDefinedName等详见 index.ts 的basics导出段。Facade 门面用 univerAPI 操作表格该包的 Facade 入口位于 packages/sheets/src/facade通过FUniver.extend(FUniverSheetsMixin)将表格能力混入全局univerAPI见 f-univer.ts。注册插件后即可获得以下门面 APIAPI说明示例univerAPI.createWorkbook(data, options?)创建新的工作簿并返回FWorkbook句柄options.makeCurrent: false可不使其成为活动工作簿univerAPI.createWorkbook({ id: workbook-01, name: Workbook1 })univerAPI.getActiveWorkbook()获取当前聚焦的电子表格工作簿无则返回nulluniverAPI.getActiveWorkbook()univerAPI.getWorkbook(id)按 id 获取指定工作簿univerAPI.getWorkbook(workbook-01)univerAPI.getActiveSheet()获取活动工作表返回{ workbook, worksheet }univerAPI.getActiveSheet()univerAPI.getSheetCommandTarget(params?)根据命令参数解析出目标{ workbook, worksheet }常在CommandExecuted事件中配合使用univerAPI.getSheetCommandTarget(event.params)univerAPI.setFreezeSync(enabled)动态开关协作场景下的冻结状态同步默认开启univerAPI.setFreezeSync(false)门面层还提供FRange区域操作、FWorksheet工作表操作、FWorkbook工作簿操作、FSelection选区操作、FDefinedName定义名称以及权限相关的FWorksheetPermission/FWorkbookPermission/FRangePermission等对象导出见 facade/index.ts。例如在CommandExecuted事件回调中univerAPI.addEvent(univerAPI.Event.CommandExecuted, (event) { const { options, ...commandInfo } event; const target univerAPI.getSheetCommandTarget(commandInfo.params); if (!target) return; const { workbook, worksheet } target; console.log(workbook, worksheet); });常见接入形态与注意事项综合以上内容给出一个包含常用配置的生产级接入示例import { Univer } from univerjs/core; import { UniverFormulaEnginePlugin } from univerjs/engine-formula; import { UniverSheetsPlugin } from univerjs/sheets; import EnUS from univerjs/sheets/locale/en-US; import ZhCN from univerjs/sheets/locale/zh-CN; const univer new Univer(); // 必须先注册公式引擎插件DependentOn 依赖约束 univer.registerPlugin(UniverFormulaEnginePlugin); univer.registerPlugin(UniverSheetsPlugin, { autoHeightForMergedCells: true, largeSheetOperation: { largeSheetCellCountThreshold: 10000, batchSize: 5000, }, }); // 合并本包贡献的 UI 文本 univer.registerLocale(enUS, EnUS); univer.registerLocale(zhCN, ZhCN);实践中的关键注意点注册顺序UniverSheetsPlugin标注了DependentOn(UniverFormulaEnginePlugin)plugin.ts必须先注册公式引擎插件版本一致所有univerjs/*包必须保持同一版本README 明示无需 CSS本包不携带样式纯逻辑场景如 Node.js 服务端、Web Worker 中的公式预计算无需引入任何 CSS 文件大表场景单元格数超过阈值后复制工作表会分批执行、删除工作表不再支持撤销需在业务层提前感知浏览器主场景实际渲染通常仍需配合univerjs/sheets-ui与univerjs/engine-render使用若以 CDN 方式加载本包的 UMD 全局变量名为UniverSheets。结语univerjs/sheets是 Univer 表格体系的逻辑中枢它用一套与 UI 无关的数据模型、命令/Mutation 体系、服务与权限架构支撑起整个电子表格的业务能力并同时面向浏览器、Worker 与服务端开放。理解它的插件配置、导出矩阵与 Facade 门面是进一步阅读上层 UI 包与进行二次开发如自定义命令、拦截器、权限点的前提。仓库内还提供了丰富的测试用例如 add-merge.command.spec.ts、auto-fill.command.spec.ts、f-range.spec.ts 等可作为深入研读各命令、服务行为的第一手资料。【免费下载链接】univerUniver is a full-stack framework for creating and editing spreadsheets / word processor / presentation on both web and server.项目地址: https://gitcode.com/GitHub_Trending/un/univer创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考