今天,写项目时,有一个table作为筛选的载体,需要选中table里面的一条数据,我想了一下,用table里面的selection功能,实现单选功能。
<template>
<div>
<el-table
ref="multipleTable"
:data="tableData"
highlight-current-row
@select-all="onSelectAll"
@selection-change="selectItem"
@row-click="onSelectOp"
>
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="序号" type="index" align="center" />
<el-table-column label="姓名" prop="name" align="center" />
<el-table-column label="手机号码" prop="province" align="center" />
</el-table>
</div>
</template>
<script>
export default {
data() {
return {
tableData: [{
name: '王小虎1',
province: '上海1',
}, {
name: '王小虎2',
province: '上海2',
}, {
name: '王小虎3',
province: '上海3',
}, {
name: '王小虎4',
province: '上海4',
}],
}
},
mounted(){
},
methods: {
onSelectAll() {
this.$();
},
selectItem(rows) {
if ( > 1) {
const newRows = ((it, index) => {
if (index == - 1) {
this.$(it, true);
return true;
} else {
this.$(it, false);
return false;
}
});
= newRows;
} else {
= rows;
}
// = ? [0].guid: "";
('2',)
},
onSelectOp(row) {
this.$();
this.$(row, true);
= [];
(row);
},
}
};
</script>