背景:table列表不满足条件得不可以点击选中
实现方式:在数据源中添加一个disabled属性
代码如下:
页面代码:
<a-table row-key="name" :columns="columns1" :data="data" :row-selection="rowSelection" :pagination="false" />
js代码:
const rowSelection = reactive({
type: 'checkbox',
showCheckedAll: true,
onlyCurrent: false,
});
const columns1 = [
{
title: 'Name',
dataIndex: 'name',
},
{
title: 'Salary',
dataIndex: 'salary',
},
{
title: 'Address',
dataIndex: 'address',
},
{
title: 'Email',
dataIndex: 'email',
},
]
const data = reactive([{
key: '1',
name: '李逍遥',
salary: 23000,
address: '新手村',
email: '李逍遥@example.com'
}, {
key: '2',
name: '景天',
salary: 25000,
address: '永安当',
email: '景天@example.com'
}, {
key: '3',
name: '石昊',
salary: 20000,
address: '小山村',
email: '十号@example.com',
disabled: true
},
{
key: '4',
name: '火灵儿',
salary: 2000,
address: '火国',
email: '灵儿@example.com',
disabled: true
},
])
实现效果如下: