Handsontable 从 12.4 升级到 13.0 迁移指南-优快云博客

本文链接：https://blog.youkuaiyun.com/gitblog_00335/article/details/148362676

Handsontable 从 12.4 升级到 13.0 迁移指南

handsontable JavaScript data grid with a spreadsheet look & feel. Works with React, Angular, and Vue. Supported by the Handsontable team ⚡ 项目地址: https://gitcode.com/gh_mirrors/ha/handsontable

前言

Handsontable 13.0 版本于 2023 年 6 月 22 日发布，作为一款功能强大的 JavaScript 数据表格组件，新版本带来了一些重要的 API 变更和功能改进。本文将详细介绍从 12.4 版本迁移到 13.0 版本需要注意的关键变更点，帮助开发者顺利完成升级。

Angular 兼容性变更

对于使用 Angular 框架的开发者，需要注意以下重要变更：

Handsontable 13.0 不再支持 Angular 11 及以下版本。经过官方测试，13.0 版本可以正常工作在 Angular 12 及以上版本，但官方仅保证对 Angular 14-16 的完整支持。

建议操作：

将 Angular 项目至少升级到 12.x 版本
推荐升级到最新的 Angular 稳定版本
如果遇到 Angular 包装器相关问题，建议联系官方技术支持

废弃 API 移除

1. 移除 beforeAutofillInsidePopulate 钩子

beforeAutofillInsidePopulate 钩子自 9.0.0 版本起就被标记为废弃，现已在 13.0 版本中完全移除。

迁移建议：

检查项目中是否使用了此钩子
如果使用了，需要寻找替代方案或重构相关逻辑

2. populateFromArray 方法参数变更

populateFromArray() 方法不再接受 direction 和 deltas 参数，这些参数原本仅供已废弃的 beforeAutofillInsidePopulate 钩子使用。

检查点：

检查所有调用 populateFromArray() 的地方
移除可能存在的 direction 和 deltas 参数

方法替换

getFirstNotHiddenIndex 方法替换

getFirstNotHiddenIndex() 方法自 12.1.0 版本起被标记为废弃，现已被 getNearestNotHiddenIndex() 方法取代。

代码示例对比：

// 旧版本用法 (已废弃)
handsontableInstance.getFirstNotHiddenIndex(0, 1, true, 1);

// 新版本用法
handsontableInstance.getNearestNotHiddenIndex(0, 1, true);

主要区别：

新方法移除了最后一个参数
方法名更准确地反映了其功能

alter 方法改进

alter() 方法不再接受 'insert_row' 和 'insert_col' 参数，这些参数自 12.2.0 版本起被标记为废弃。

新方法提供了更精确的控制：

// 插入行相关操作
handsontableInstance.alter('insert_row_below'); // 在最后一行下方插入
handsontableInstance.alter('insert_row_above', 10); // 在第10行上方插入

// 插入列相关操作
handsontableInstance.alter('insert_col_end'); // 在最后一列右侧插入
handsontableInstance.alter('insert_col_start', 10); // 在第10列左侧插入

优势：