不会代码怎么做外贸网站,外贸网站平台都有哪些 免费的,外贸网站怎么做优化,做网站链接还要服务器吗买不知道大家是不是在AntDesign的某一个列表想要做一个批量导出或者操作的时候#xff0c;发现只要选择下一页#xff0c;即使选中的ids 都有记录下面#xff0c;但是就是不回显 后来问了chatGPT#xff0c;对方的回答是#xff1a; 在Ant Design的DataTable组件中#xf…不知道大家是不是在AntDesign的某一个列表想要做一个批量导出或者操作的时候发现只要选择下一页即使选中的ids 都有记录下面但是就是不回显 后来问了chatGPT对方的回答是 在Ant Design的DataTable组件中当进行分页操作时会重新渲染表格内容这会导致之前选中的行数据和选中状态丢失。
于是最后想到了一个办法处理通过onTableChange时间来控制 代码如下
private onTableChange (newSelectedRowKeys: string[]) {console.log(newSelectedRowKeys);const { selectedRowKeys } this.state;setTimeout(() {this.dispatch(actions.tableRowSelectionChangeAction(this.tableId,map(selectedRowKeys, (value) {return value;})));}, 300);
};private onTableRowSelectAll (selected: boolean,selectedRows: any[],unSelectedRows: any[]
) {const { selectedRowKeys } this.state;if (selected) {const addRows selectedRows.filter((item: any) {return !selectedRowKeys.includes(item.id);});const addRowsRowIds map(addRows, id);this.setState({ selectedRowKeys: [...selectedRowKeys, ...addRowsRowIds] });} else {const deleteIds: any map(unSelectedRows, id);const deleteRows selectedRowKeys.filter((item: any) {return !deleteIds.includes(item);});this.setState({ selectedRowKeys: [...deleteRows] });}
};private onTableSelect (record: any, selected: boolean) {const { selectedRowKeys } this.state;if (selected) {this.setState({selectedRowKeys: [...selectedRowKeys, record.id],});} else {this.setState({selectedRowKeys: selectedRowKeys.filter((key) key ! record.id),});}
};使用onTableChange 因为它是几个方法中最后一个执行的方法也是必触发的方法然后通过dispatch对表的selectedRowKeys重新处理
this.dispatch(actions.tableRowSelectionChangeAction(this.tableId,map(selectedRowKeys, (value) {return value;})));如果对大家有帮助留下个小爱心吧
