错误效果(序号1是获取数据后,初始化禁用的项): 正确效果:
原因:未给数据指定key
<template> <a-table :row-selection="rowSelection" :columns="columns" :data-source="data"> <a slot="name" slot-scope="text">{{ text }}</a> </a-table> </template> <script> const columns = [ { title: 'Name', dataIndex: 'name', scopedSlots: { customRender: 'name' }, }, { title: 'Age', dataIndex: 'age', }, { title: 'Address', dataIndex: 'address', }, ]; const data = [ { name: 'John Brown', age: 32, address: 'New York No. 1 Lake Park', }, { name: 'Jim Green', age: 42, address: 'London No. 1 Lake Park', }, { name: 'Joe Black', age: 32, address: 'Sidney No. 1 Lake Park', }, { name: 'Disabled User', age: 99, address: 'Sidney No. 1 Lake Park', }, ]; export default { data() { return { data, columns, selectedRowKeys:[],//选中的key,清空选中时赋值空数组即可 }; }, computed: { rowSelection() { return { selectedRowKeys: this.selectedRowKeys, onChange: (selectedRowKeys, selectedRows) => { console.log(`selectedRowKeys: ${selectedRowKeys}`, 'selectedRows: ', selectedRows); }, getCheckboxProps: record => ({ props: { disabled: record.name === 'Disabled User', // 禁用项 name: record.name, }, }), }; }, }, mounted(){
let that = this; for (let i in that.dataTable) { that.dataTable[i].key = parseInt(i) + 1; // <== 关键——全选时不选择禁用数据 } } }; </script>