handsontable-react @14.5.0版本组件怎么通过core获取到当前正在编辑单元格的row和Col,具体代码案例
时间: 2024-09-19 22:05:31 浏览: 41
Handsontable React 是一个用于创建交互式电子表格的库,它允许你在 React 应用中轻松集成 Handsontable 功能。如果你想在 v14.5.0 版本中获取正在编辑的单元格的行(row)和列(col),你可以使用 `onCellEditorChange` 或 `afterRenderCell` 钩子。
这里有一个简单的例子:
```jsx
import React from 'react';
import { HandsontableReact } from 'handsontable/react';
class MyTable extends React.Component {
constructor(props) {
super(props);
this.handsontable = null;
}
// 使用 onCellEditorChange 钩子获取编辑单元格的信息
handleCellEditorChange(row, col, value, editorInstance) {
const { rowModel } = this.handsontable.getSettings();
if (rowModel === 'aggregation') {
console.log(`Editing cell at row ${row}, column ${col}`);
}
}
render() {
const columns = [
{ data: 'Name' },
{ data: 'Age' },
// ... 其他列
];
return (
<div>
<HandsontableReact
data={yourData}
rowHeaders={true}
columns={columns}
afterRenderCell={(instance, td, row, col, prop) => {
// 使用 afterRenderCell 钩子,注意此处td代表单元格元素
instance.currentRow = row; // 如果需要的话,可以保存当前行
instance.currentCol = col; // 同样,保存当前列
}}
onCellEditorChange={this.handleCellEditorChange} // 注册事件处理函数
/>
</div>
);
}
}
export default MyTable;
//
阅读全文