背景
默認的el-select可以實現多選，模糊查詢等功能，但是沒有全選按鈕，話不多說，咱們加一個。
html部分
<el-select
v-model="search[item.col_name]"
multiple
collapse-tags
filterable
:placeholder="'請選擇'+item.col_cn_name"
>
<el-checkbox
v-model="checkbox[item.col_name]"
style="height: 24px;line-height: 24px;padding-left: 5px;"
@change="selectAll(item,index)"
>全選</el-checkbox>
<el-option
v-for="(option) in item.datas"
:key="option.value"
:label="option.label"
:value="option.value"
></el-option>
</el-select>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] = [];
}
}效果
原創文章，作者：投稿專員，如若轉載，請註明出處：https://www.506064.com/zh-hant/n/233353.html
微信掃一掃 
支付寶掃一掃 