react⼊坑学习（五）ANTtable设置默认选中⾏
ANT table 设置默认选中⾏
查了⼀个上午，搜到的全是很久之前的checked,defaultChecked啥的全是很久之前的版本了，然后仔细看了看，（官⽹的服务器太差了，这⼏天⽼是访问不了）
附加⼀个
现在改成了selectedRowKeys，且需要跟onchange⼀起⽤,
摸索了半天，⼼得如下：
const[defaultselecteddata, setdefaultselecteddata]=useState([]);
//defaultselecteddata是你table的rowKey所组成的数组，
//想要默认选中哪个，就在defaultselecteddata中加⼊对应的rowKey
//接着在table中设置rowselection
rowSelection={{
onChange:(selectedRowKeys, selectedRows)=>{
setdefaultselecteddata(selectedRowKeys);
},
selectedRowKeys:defaultselecteddata,
//设置了默认选中⾏
//但是光这么设置，选中⾏就会被锁定住，再点击其他的checkbox也没有⽤
//所以需要在onChange()中更新defaultselecteddata
}}
欢迎留⾔讨论
如果有帮助到你，能点个赞嘛！!谢谢react native
PS：
可能有些地⽅没有写的太清楚，附上根据官⽹⽰例修改的源代码
import React,{ useState, useEffect }from'react';
import{ Table }from'antd';
export default function NewPage(){
const[defaultselecteddata, setdefaultselecteddata]=useState([]);
useEffect(()=>{
setdefaultselecteddata([1,2])
},[])
const dataSource =[
{
key:1,
name:'胡彦斌',
age:32,
address:'西湖区湖底公园1号',
},
{
key:2,
name:'胡彦祖',
age:42,
address:'西湖区湖底公园1号',
},
];
const columns =[
{
title:'姓名',
dataIndex:'name',
key:'name',
},
{
title:'年龄',
dataIndex:'age',
key:'age',
},
{
title:'住址',
dataIndex:'address',
key:'address',
},
];
return(
<div>
<Table
dataSource={dataSource}
columns={columns}
rowSelection={{
//设置了默认选中⾏
//但是光这么设置，选中⾏就会被锁定住，再点击其他的checkbox也没有⽤//所以需要在onChange()中更新defaultselecteddata
selectedRowKeys:defaultselecteddata,
onChange:(selectedRowKeys, selectedRows)=>{
setdefaultselecteddata(selectedRowKeys);
},
}}
/>
</div>
);
}

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。