html多选按钮代码_html中checkbox用法

html多选按钮代码_html中checkbox用法,第1张

html多选按钮代码_html中checkbox用法 背景默认的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]=[];}}效果

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/tougao/650715.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-04-17
下一篇 2022-04-17

发表评论

登录后才能评论

评论列表(0条)

保存