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()
}
相关推荐
郭邯几秒前
从需求到上线:我用 AI 辅助开发了一个在线倒计时器
前端
全栈项目管理程序猿4 分钟前
ArcGIS JS 基础教程(14):Map、View 与 Layer 关系
javascript
Damai5 分钟前
Next.js 切换动态路由后,为什么页面还保留着上一个分类的数据?
前端·react.js
程序员鱼皮6 分钟前
爆火的《牛来》模型正式发布!DeepSeek 的排名又下降了。。
前端·后端·ai编程
MocMoc12 分钟前
从零落地全栈 Monorepo:Turbo + npm workspaces 实战(附一个记账小应用)
前端
灯澜忆梦13 分钟前
【基于GO的Web开发15】gin路由和路由组
前端·后端·golang·gin
Southern Wind19 分钟前
从一段文字到一部动态漫:如何打造全流程分镜创作工作台 StoryCanvas AI
前端·javascript·vue.js·人工智能
烂蜻蜓25 分钟前
Flask入门教程(七):请求与响应——Web应用的核心数据流
前端·python·flask
爱勇宝32 分钟前
从前端到全栈,我最后学会的是:先做产品
前端·后端