elemnt-ui table改为只能单选

Posted 北辰浅巷墨漓

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了elemnt-ui table改为只能单选相关的知识,希望对你有一定的参考价值。

这几天遇到了这样一个需求:使用element-UI的table组件,但是又只能勾选其中一条数据,从而进行其他的操作。

解决办法:

//单选
    selectData(selection, row) {
		this.$refs.multipleTable.clearSelection();
		if (selection.length === 0) {
			return;
		}
		this.$refs.multipleTable.toggleRowSelection(row, true);
	 	this.currentRow = row
		this.getDetailClick(row)
    },
    //全选
	selectAll(){
		this.$refs.multipleTable.clearSelection();
	},

在table组件中:

<el-table
			ref="multipleTable"
			:data="ReportTemplateList"
			highlight-current-row
			@select="selectData"
			@select-all="selectAll"
		>
</el-table>

以上是关于elemnt-ui table改为只能单选的主要内容,如果未能解决你的问题,请参考以下文章

elemnt-ui table改为只能单选

elemnt-ui table改为只能单选

ElementUI el-table 表格 行选择框改为单选

ElementUI 将table多选框改为单选框的解决办法

设置ElementUI表格只能单选效果教程

设置ElementUI表格只能单选效果教程