element表格实现复选框单选
默认表格前面的复选框是可以选择多个,但有的需求是只能选择一个,
可以通过clearSelection和toggleRowSelection去实现,把当前选中的这条selected设置成true。
<div class="same-table"> <el-table :data="tableData" class="oneTabel" ref="multipleTable" border fit @selection-change="handleSelectionChange" @select-all="dialogCheck" @select="dialogCheck" style="width:100%;"> <el-table-column type="selection" width="50"></el-table-column> <el-table-column type="index" width="60" label="序号"></el-table-column> <el-table-column prop="name" label="机构"></el-table-column> <el-table-column prop="negativeDec" label="负面清单描述"></el-table-column> </el-table> </div>
methods: { handleSelectionChange(val) { console.log(val, 'val') this.multipleSelection = val; }, dialogCheck: function(selection, row) { console.log(selection, row); this.$refs.multipleTable.clearSelection() if (selection.length === 0) { return } if (row) { this.selectioned = row this.$refs.multipleTable.toggleRowSelection(row, true) } } }