实现样式:
<Table row-key="id" :columns="columns" :data="data" border ></Table>
// data代码:
currentChoose:'',
columns: [
{
title: '#',
width: 60,
align: 'center',
render: (h, params) => {
let id = params.row.id;
let flag = false;
let isshow = params.row._disabled
if (this.currentChoose === id) {
flag = true
} else {
flag = false
}
let self = this
return h('div', [
h('Radio', {
props: {
value: flag,
disabled:isshow
},
on: {
'on-change': () => {
self.currentChoose = id;
}
}
})
])
}
},
{
title: 'Name',
key: 'name',
tree: true
},
{
title: 'Age',
key: 'age'
},
{
title: 'Address',
key: 'address'
}
],
data: [
{
id: '100',
name: 'John Brown',
age: 18,
address: 'New York No. 1 Lake Park'
},
{
id: '101',
name: 'Jim Green',
age: 24,
address: 'London No. 1 Lake Park',
_showChildren:true,
_disabled:true,
children: [
{
id: '10100',
name: 'John Brown',
age: 18,
address: 'New York No. 1 Lake Park'
},
{
id: '10101',
name: 'Joe Blackn',
age: 30,
address: 'Sydney No. 1 Lake Park'
},
{
id: '10102',
name: 'Jon Snow',
age: 26,
address: 'Ottawa No. 2 Lake Park',
_disabled:true,
_showChildren:true,
children: [
{
id: '1010200',
name: 'Jim Green',
age: 24,
address: 'New York No. 1 Lake Park'
}
]
}
]
},
{
id: '102',
name: 'Joe Black',
age: 30,
address: 'Sydney No. 1 Lake Park'
},
{
id: '103',
name: 'Jon Snow',
age: 26,
address: 'Ottawa No. 2 Lake Park'
}
]