说明:以下方法只是省市级联,市区级联可类比
<!-- 这是省级选择框 -->
<el-select class="top_inp"
v-model="selectvalue1"
@change="changeAddress($event)"
placeholder="请选择">
<el-option
v-for="item in selectoptionssheng"
:key="item.id"
:label="item.areaname"
:value="item.id">
</el-option>
</el-select>
changeAddress (e) {
this.selectoptionsshi = [] // 选中省份重绘市级数据
this.selectvalue = '' // 清空市级框中的值
// selectoptionssheng指后台返回的所有数据
let arr = this.selectoptionssheng.map(item => {
return item.childList
})
for (let i = 0; i < arr.length; i++) {
for (let j = 0; j < arr[i].length; j++) {
if (e === arr[i][j].parentid) {
this.selectoptionsshi .push(arr[i][j])
}
}
}
},
如果省市区级联可以在此基础上再在市级选择框写一个change事件,然后使用同样的方法,通过for循环类比 子类中的prantid 和 父级 id,然后通过push函数添加进市级数组
本文介绍如何在Vue中创建一个省市区级联选择框,通过`v-model`和`change`事件,利用for循环遍历数据,根据上级ID筛选下级选项并动态更新市级选择框。

1953

被折叠的 条评论
为什么被折叠?



