SpreadJS 纯前端表格控件 - V18.0 新特性
工作簿
从右到左的文档模式和文本方向，支持西亚语言用户使用
SpreadJS 的标准方向是从左到右，但在此新版本中，我们正式添加了从右到左的方向，可以通过将工作表的RightToLeft选项设置为true来启用此功能。
表格（Table）绑定数据管理器中的表，实现更高的性能和容量
在 V18 中，我们增强了表数据绑定功能，以支持绑定到数据管理器中的表。这意味着现在可以将工作表的数据和公式添加到数据管理器表中，以使数据更加集中以供在 SpreadJS 的其他区域使用。此功能还支持绑定数据管理器表中的特定列或自动生成列。
此外，导入 Excel 文件时，可以使用新的导入标志将工作表转换为数据管理器表，大幅提升导入的性能：
测试用例：打开和保存带有海量公式表格的 Excel 文件
- 文件大小：40 MB
- 包含 18 个表格
- 共计数据行数 15 万行
数据区域（DataRange）
为了帮助实现数据管理器表绑定，新的数据区域提供了完全控制特定工作表范围区域并将行/列坐标转换为数据表坐标的能力，使用户能够更轻松地专注于应用程序的业务逻辑。
功能介绍及核心点
- 数据驱动的单元格区域，支持绝大部分的原生单元格区域能力，例如表头、样式、合并
- 支持在普通工作表中嵌入集算表、甘特图及报表等以数据为底层各类特殊区域，布局灵活自由
- 提供全面的接口 API，供用户扩展
- 支持导入导出 Excel / SJS / SSJON
- 相对普通单元格区域，具备更高的性能
示例及主要接口
对角线单元格类型
SpreadJS 中添加了一种新的单元格类型，允许我们在单元格内插入对角线。
这对于设计表格标题或报告中的单独区域非常有用。这些单元格可以显示由对角线分隔的不同部分的多个文本项：
这些单元格类型还支持许多不同的属性，包括值类型、显示规则、线条样式、文本方向、文本换行和剪切以及从右到左的布局。
单元格是否可编辑状态
新版本添加了一个名为 allowEditInCell 的新属性，用于防止编辑单元格。如果将此属性设置为 false，则在用户双击单元格或使用键盘开始编辑时，单元格将无法进入编辑模式。如果只能使用 ComboBox 或 CheckBox 等单元格类型更改单元格，则此功能非常有用。
使用 Shift + 鼠标滚轮进行水平滚动
在此版本之前，SpreadJS 中的垂直滚动是使用鼠标滚轮或垂直滚动条进行的，但水平滚动只能使用水平滚动条完成。在此版本中，我们添加了使用 Shift + 鼠标滚轮进行水平滚动的功能。
通过命令更改编辑器状态
SpreadJS 中添加了两个新命令，允许我们更改编辑器状态。这些命令是：
- StartEdit：用于使用编辑模式编辑活动单元格
- ChangeEditorStatus ：用于在编辑单元格时在输入模式和编辑模式之间切换编辑器状态
搜索单元格批注（Comments）
SpreadJS 中现有的搜索功能支持以下内容：
- 单元格值
- 单元格公式
- 单元格标签
在 V18 版本中，搜索功能现在支持在工作表中的批注内进行搜索。通过此增强功能，SpreadJS Designer 组件搜索对话框现在还支持搜索单元格批注和标签。
getUsedRange API 支持 Tag 类型
为了支持搜索单元格标签，getUsedRange API 已更新为通过GC.Spread.Sheets.UsedRangeType枚举中的标签选项支持标签类型。
使用键盘选中/取消选中筛选项
添加了新的键盘快捷键，用于与 SpreadJS 中的过滤器进行交互。当用户打开过滤器时，他们可以使用以下键与其进行交互：
- 空格键：当列表聚焦时，选中/取消选中列表中的项目
- 左箭头键：当列表聚焦时，折叠列表中当前项目的所有子项目
- 右箭头键：当列表聚焦时，展开列表中当前项目的所有子项目
- 向上和向下箭头键：在过滤器列表框之外，这将切换过滤器对话框中的焦点
ComboBox CellType 支持绑定数据源
SpreadJS 中的 ComboBox CellTypes 现在支持绑定到表列。
该表可以作为数据管理器中的数据表或公式的结果出现。
已向 ComboBox CellType 添加了新的dataBinding方法来支持此功能：
表格调整大小事件取消选项
为了通过设置表格的行数或列数限制来控制表格大小调整，TableResizing事件现在提供了一个Cancel参数。以编程方式设置是否停止当前的调整大小操作，默认情况下设置为 false。
数据透视表插件
更改数据源
数据透视表现在支持更改数据源并将现有布局信息同步到新数据源。
updateSource方法用于更改当前数据源，当需要添加更多行或修改现有数据集时很有用。这也可以通过 Designer UI 来实现：
在单个字段中显示小计
与 Excel 类似，现在可以在数据透视表中显示各个字段的小计信息。可以使用subtotalVisible方法控制这些小计的可见性：
筛选对话框键盘操作支持
与 SpreadJS 中的标准过滤器对话框一样，数据透视表的过滤器对话框现在也支持键盘操作：
- Tab - 将焦点切换到下一个项目
- Shift + Tab - 将焦点切换到上一个项目
- Up/Down Arrow - 将焦点切换到上一个/下一个子项
- Left/Right Arrow - 展开或折叠子项
- Space - 在列表中选中/取消选中项目，或执行当前选择选项
- Enter - 保存当前设置或者执行焦点所在的操作项
- Esc - 关闭当前对话框
（使用 Tab / Shift + Tab）
（使用 Up / Down）
报表插件增强 / ReportSheet
图表支持
浮动图表
浮动图表是显示图表的标准方式，其位置基于左上角单元格，图表浮动在单元格上方。这些图表支持绑定到模板表中的表格或数据管理器中的表格。
模板单元格图
单元格图表是设置在模板工作表中单元格内的图表，类似于迷你图。这对于为特定数据字段设置多个图表很有用，例如为不同区域设置图表：
分页
这些图表还支持数据分页，允许您将数据分成可循环浏览的页面。
全部展开/折叠
报告表的展开和折叠功能已得到增强，支持展开和折叠特定单元格的所有单元格以及相关单元格。
在数据源面板中查找字段
创建 ReportSheet 时，左侧将显示一个面板，其中显示 DataManager 中所有已注册的表。在 V18 版本中，数据源面板现在支持搜索字段：
向导中的更多聚合函数选项
SpreadJS ReportSheet Wizard 可帮助您在易于使用的 UI 中创建报告和配置报告设置。在 V18 版本中，我们添加了更多聚合选项，特别是为了帮助分组和交叉报告：
设计模板的容器支持
在创建报表模板时，现在可以将容器添加到特定范围，帮助用户轻松设计报表。这些容器有三种不同的类型，所有字段都逐一设置到容器中：
- 列表 - 字段从左到右设置
- 组 - 字段从左到右设置
- 交叉 - 字段从上到下设置
一旦设置了字段，就会自动生成字段标签和样式。
字段值编辑器的下拉选择功能
在 V18 中，SpreadJS 现在支持通过设计器中字段值编辑器中的下拉框选择 ReportSheet 字段的参数。这对于具有参数可供选择的值很有用：
一旦设置了字段，就会自动生成字段标签和样式。
计算引擎（公式函数）
新的聚合函数（GROUPBY、PIVOTBY 和 PERCENTOF）
SpreadJS V18 支持新的聚合函数：
- GROUPBY：通过按行字段分组并聚合相关值来创建数据摘要。
- PIVOTBY：通过沿两个轴分组并聚合相关值来创建数据摘要。
- PERCENTOF：对第一个参数求和，然后除以第二个参数的和。这对于GROUPBY和PIVOTBY特别有用，因为它可以返回百分比。
函数引用
函数引用功能（也称为 Eta 简化 Lambda 函数）通过消除不必要的抽象来简化函数，当函数没有进一步的操作要对其参数执行时。这使我们能够在可能的情况下使用缩写语法。这可以通过定义自定义名称来实现，其内容包含公式名称，例如“SUM”：
这种类型的简化也可以与 LET 函数和 LAMBDA 函数一起使用。
表格设计器 / Designer
支持搜索不可见范围
设计器中的“查找/替换”对话框已得到增强，添加了“忽略隐藏”选项以支持搜索不可见范围。设置为 true 时，搜索时将忽略隐藏范围，设置为 false 时将包括隐藏范围：
框架
运行时和设计 Vue Wrapper TypeScript 支持
SpreadJS 的 Vue 包装器现在包含一个index.d.ts文件，以使用 Vue 3 支持 TypeScript。
Angular 18 支持
SpreadJS 现在已发布支持 Angular 18。
历史版本
查看更多关于 SpreadJS 纯前端表格控件的历史版本。