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()
}
相关推荐
天若有情6734 分钟前
Node.js 是什么?npm 是什么? Vue 为什么需要他们?
vue.js·npm·node.js
姜太小白5 分钟前
【ECharts】多个ECharts版本共存解决方案
前端·javascript·echarts
前端风云志8 分钟前
JavaScript面试题,为什么[] + 0 = '0', 而{} + 0 = 0?
javascript
雲墨款哥11 分钟前
Vue 3 响应式黑魔法:ITERATE_KEY 如何解决新增属性的响应性难题
vue.js·面试
花木偶18 分钟前
【郑大二年级信安小学期】Day9:XSS跨站攻击&XSS绕过&CSRF漏洞&SSRF漏洞
前端·xss
FogLetter19 分钟前
节流(Throttle):给频繁触发的事件装上"冷却时间"
前端·javascript
小公主21 分钟前
彻底搞懂 Event Loop!这篇文章帮你一次性吃透宏任务、微任务、执行顺序
前端·javascript
xiaominlaopodaren24 分钟前
爱心动画的数学之美:从心形曲线到粒子系统
前端
AI悦创Python辅导41 分钟前
如何挑选适合项目场景的数据分析工具?
前端
用户92724725021944 分钟前
新闻自动采集并通过API发布到博客
前端·后端