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()
}
相关推荐
小码哥_常19 小时前
从MVC到MVI:一文吃透架构模式进化史
前端
嗷o嗷o19 小时前
Android BLE 的 notify 和 indicate 到底有什么区别
前端
豹哥学前端19 小时前
别再背“var 提升,let/const 不提升”了:揭开暂时性死区的真实面目
前端·面试
Lkstar19 小时前
我把Vue2响应式源码从头到尾啃了一遍,这是整理笔记
vue.js
lar_slw20 小时前
k8s部署前端项目
前端·容器·kubernetes
这里不能睡觉20 小时前
js 实现 Blob、File、ArrayBuffer、base64、URL 之间互转
javascript
拉拉肥_King20 小时前
Ant Design Table 横向滚动条神秘消失?我是如何一步步找到真凶的
前端·javascript
GreenTea20 小时前
DeepSeek-V4 技术报告深度分析:基础研究创新全景
前端·人工智能·后端
河阿里21 小时前
HTML5标准完全教学手册
前端·html·html5
吴声子夜歌21 小时前
Vue3——新语法
前端·javascript·vue.js