React AntD 表格查看修改时默认选中几行数据

hook定义selectedRowKeys

const [selectedRowKeys, setSelectedRowKeys] = useState([]);
const [selectedRowsState, setSelectedRows] = useState([]);

初始化时利用setSelectedRowKeys给selectedRowKeys塞值,时行数据的rowKey的数组。

设置table属性rowSelection

    <TablerowKey="id"columns={columns}rowSelection={{type: 'checkbox',selectedRowKeys, // selectedRowKeys: selectedRowKeys的简写onChange: (selectedRowKeys, selectedRows) => {console.log('selectedRowKeys:',selectedRowKeys, 'selectedRows: ', selectedRows);setSelectedRowKeys(selectedRowKeys);setSelectedRows(selectedRows);},}}/>

selectedRowKeys与onChange来实现默认选中行

设置表格disable使用getCheckboxProps设置

ts版本不难就自己写吧，解决了您的问题，点个赞哈，祝好

React AntD 表格查看修改时默认选中几行数据相关推荐

通过JS修改select默认选中值触发onchage事件
通过JS修改select默认选中值触发onchage事件前言一.body部分二.js部分前言页面加载时,通过js修改select选中值,触发onchange事件,实现联动效果以下是本篇文章 ...
vue element-ui只有一条信息时默认选中按钮，且不能取消，多条信息时可以手动选择
vue element-ui只有一条信息时默认选中按钮,且不能取消,多条信息时可以手动选择用lodash方法进行原数据的深拷贝 // 编辑多规格产品时必须选中一个默认规格setColumnData( ...
Excel快速下拉多行函数式、快速选中多行数据
[1]Excel快速下拉多行函数式如图红色框选中,D1:D5000,即可以快速下拉到第5000行 [2]快速选中多行数据 shift选中双击下边框 [3]按一定概率生成随机数 =IF(RAND()& ...
layui table勾选框的修改_Layui默认选中table的CheckBox复选框方法_飛雲_前端开发者...
方法一:如何根据条件判断是否默认选中table表格前面的复选框 table.render({ elem: '#userTable' , url: '../sysRole/getUserList' , ...
element table 表格合并及如何默认选中合并后的第一行
1. 合并效果及代码如下: 1.表格头 2.js 合并前的每一个小行都会执行一此下面这个代码,如上图所示,执行第一行时合并,执行到第二行设置合并行数为0 就可以了 objectSpanMethod({ ...
antd 中 Tree 的使用-默认选中问题
在使用antd的Tree 控件的控件的时候,数据回显的时候发现所有的都选中了,很奇怪 <Tree checkable ={true}showLine = {true}multiple={true ...
bootstrap-multiselect.js多选下拉框初始化时默认选中初始值
bootstrap-multiselect.js多选下拉框默认值设置一.案例数据格式二.HTML代码 <select id="msgRoles" multiple=&q ...
修改USB默认选中MTP模式
Android连接USB默认选中MTP模式,并删除"为设备充电选项" Android系统默认连接USB会显示:正在通过USB为此设备充电,需求是删除"为设备充电选项&qu ...
react+antd表格操作列加Dropdown和menu写法
需求:表格的每行操作里,有一个Dropdown组件,里面是menu组件,这里在列进行渲染的时候,把行数据传给menu,menu被点击的时候获取到行数据进行弹框展示代码分析: 1.表格的列渲染操作列的 ...

React AntD 表格查看修改时默认选中几行数据

React AntD 表格查看修改时默认选中几行数据相关推荐

最新文章

热门文章