首页 > 其他 > 详细

element实现选择器,全选功能

时间:2020-02-25 15:42:18      阅读:18      评论:0      收藏:0      [点我收藏+]

标签:通过   行数据   else   code   实现   pan   

首先增加全选按钮:

<el-select filterable v-model="cityIds" multiple  collapse-tags   placeholder="请选择"  @change="getCityNames" >
           <el-option label="----全选----" value="000"></el-option>
          <el-option v-for="item in options.cityList" 
                        :key="item.area_id" 
                        :label="item.area_name"
                        :value="item.area_id">
           </el-option>
</el-select>

通过watch事件进行,全选互斥:

watch: {
            cityIds:function(value){
                let valength = value.length;
                if(valength > 1 && value[valength - 1] == "000"){
                    this.cityIds = ["000"];
                }else if(valength == 2 && value[0] == "000"){
                    this.cityIds.shift();
                }
            }
        },

最后再通过change事件进行数据处理,ok

 

element实现选择器,全选功能

标签:通过   行数据   else   code   实现   pan   

原文:https://www.cnblogs.com/DIVEY/p/12361875.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 bubuko.com 版权所有 鲁ICP备09046678号-4
打开技术之扣,分享程序人生!
             

鲁公网安备 37021202000002号