el-selsect实现三级联动
html:
数据结构如下:
可以使用el-select自带函数chang,获取返回的value值,使用find函数去查找与value值对应的数据
handleSelectChange1(e) { this.areaForm.selectSecondColumnObj = this.areaArr.find((item) => { return e == item.value; //查找一级数组里与value对应的数据,返回的是一个对象 }); this.secondareaList = this.areaForm.selectSecondColumnObj.children; //把所需要的对象里的数组存在secondareaList里,这将是二级选框里的内容 this.areaId = e; }, handleSelectChange2(e) { this.areaForm.selectThreeColumnObj = this.secondareaList.find((item) => { return e == item.value; //查找二级数组里与value值对应的数据 }); this.threeareaList = this.areaForm.selectThreeColumnObj.children; //三级选框里的内容 this.streetId = e; }, handleSelectChange3(e) { this.comId = e; },