Vue+ElementUI 实现三级省市联动(附带数据)

HTML部分：

js部分：

data

methods方法部分

计算属性computed

 computed: {
                getTotal(){
                    return this.myCarts.reduce((a,b) =>{
                        return a + b.price * b.quantity;
                },0);
                },

                getAddressProvince(value){
                    value = this.form.addressProvince;

                    for(y in this.CityInfo){
                        if(this.CityInfo[y].value == value){
                            return value = this.CityInfo[y].label;
                        }
                    }
                },
                getAddressCity(value){
                    value = this.form.addressCity;

                    for(y in this.CityInfo){
                        for(z in this.CityInfo[y].children){
                            if(this.CityInfo[y].children[z].value == value && value!=undefined){
                                return value = this.CityInfo[y].children[z].label;
                            }
                        }
                    }
                },

                getAddressDistrict(value){
                    value = this.form.addressDistrict;

                    for(y in this.CityInfo){
                        for(z in this.CityInfo[y].children){
                            for(i in this.CityInfo[y].children[z].children){
                                if(this.CityInfo[y].children[z].children[i].value == value && value!=undefined){
                                    return value = this.CityInfo[y].children[z].children[i].label;
                                }
                            }
                        }
                    }
                },

完整代码和省市区数据文件传送门

---

欢迎关注公众号Java技术大本营，会不定期分享BAT面试资料等福利。

---