checkbox全选_elementUI | el-select组件增加全选按钮

最新推荐文章于 2025-07-01 07:41:48 发布

weixin_39860952

最新推荐文章于 2025-07-01 07:41:48 发布

阅读量643

点赞数

文章标签： checkbox全选 checkbox全选子集全选父级也自动 js中select下拉框重置 select下拉框带模糊查询

本文介绍如何在默认的el-select组件中增加全选功能，通过简单的代码实现了多选和模糊查询的同时支持一键全选操作。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

背景

默认的el-select可以实现多选，模糊查询等功能，但是没有全选按钮，话不多说，咱们加一个。

html部分

全选

data定义

checkbox: {}

js部分

selectAll(item, index) {      //我这里是针对循环的多个下拉框增加多选。如果是单个，直接判断v-model绑定的值即可。      if (this.checkbox[item.col_name]) {        item.datas.forEach(item1 => {         //按照自己的需求push就可以啦。          this.search[item.col_name].push(item1.value);        });      } else {        this.search[item.col_name] = [];      }    }

效果