Ant design table实现单选和点击行选中

实现单选

Antd table实现单选非常方便只需要在rowSelection属性里添加type: radio即可。
在这里插入图片描述

实现点击行选中

需要用到onRow属性
在这里插入图片描述
Ant design table实现单选和点击行选中_第1张图片
onClick事件里面手动设置selectRowKey,跟Table onChange事件一样

onRow={(record) => ({
	onClick: () => {
		console.log(record)
		setSelectedRowKeys([record.docId])
	}
})}

要注意的是selectRowKeys是一个数组,赋值的时候需要变成数组

完整配置如下:
Ant design table实现单选和点击行选中_第2张图片

你可能感兴趣的:(reactjs,antd,table,表格单选,表格点击行选中)