ant design vue3表格选择和操作坑
需要给a-table标签,加入key属性,表示唯一代码<a-table :columns="columns" :rowKey="rowKeyMethod" :data-source="dataSource" :pagination="false" bordered:row-selection="{selectedRowKeys:selectedRowKeys1, onChange: onRo
·
注意点1
需要给a-table标签,加入rowKey参数,表示唯一
否则会出现选不中,或者一下子全选中(页面显示)但返回的值不对,
解决代码
<a-table :columns="columns" :rowKey="(record) => record.messageId" :data-source="dataSource" :pagination="false" bordered
:row-selection="{selectedRowKeys:selectedRowKeys1, onChange: onRowChange}"
>
</a-table>
setup中
const rowKeyMethod = (record: any) => {
return record.messageId;
}
注意点2
选中需要用到row-selection
参数,需要设置该参数下的selectedRowKeys
和onChange
selectedRowKeys
代表选中的项的id,是一个数组形式
onChange
代表选中项发生变化的回调,有两个参数第一个是选中的id,第二个是选中的项内容,注意要将第一个选中的id赋值给selectedRowKeys
,否则会选中不了。
错误不赋值的效果
控制台也不会输出打印的内容。
正确:赋值id
更多推荐
已为社区贡献18条内容
所有评论(0)