el-table全部选择和全部取消

el-table实现全部选择和全部取消

其实非常简单,el-table自带的都有方法toggleAllSelection()和clearSelection()

具体代码如下:

html 复制代码
<el-button type='success' @click='checkAll' size='small'>全选</el-button>
<el-button type='success' @click='cancelAll' size='small'>反选</el-button>
js 复制代码
// 全选
checkAll() {
	// 因为toggleAllSelection()是改变选中状态,这里我们要的是全选中,所以先对其进行清空,再选中,就是全选啦
	this.$refs.table.clearSelection()
    this.$refs.table.toggleAllSelection()
}
// 反选
cancelAll() {
    this.$refs.table.clearSelection()
}
相关推荐
waterHBO18 分钟前
直接从图片生成 html
前端·javascript·html
EndingCoder29 分钟前
JavaScript 时间转换:从 HH:mm:ss 到十进制小时及反向转换
javascript
互联网搬砖老肖1 小时前
React组件(一):生命周期
前端·javascript·react.js
我科绝伦(Huanhuan Zhou)1 小时前
深入解析Shell脚本编程:从基础到实战的全面指南
前端·chrome
小马哥编程1 小时前
React和Vue在前端开发中, 通常选择哪一个
前端·vue.js·react.js
aklry1 小时前
uniapp实现在线pdf预览以及下载
前端·pdf·uni-app
HCl+NaOH=NaCl+H_2O1 小时前
Quasar组件 Carousel走马灯
javascript·vue.js·ecmascript
℘团子এ1 小时前
vue3中预览Excel文件
前端·javascript
shmily麻瓜小菜鸡2 小时前
在 Angular 中, `if...else if...else`
前端·javascript·angular.js
bloglin999993 小时前
npm和nvm和nrm有什么区别
前端·npm·node.js