ARTICLE DETAIL

资讯详情

深耕网站建设、视觉设计与SEO优化的一线实战洞察。

vue2 省市区联动组件封装

vue2 省市区联动组件封装

在element ui中有级联选择器el-cascader,其实已经够用了,但是在实际需求中,发现el-cascader如果有三级,数据数组必须得三个才能完全展示,所以不符合实际需求,还是自定义封装吧

需求:省市区联动数组,有多少个显示多少个

这里使用element ui得el-select组件,思路是使用监听

布局

  <el-selectref="selectProvinces"v-model="provinces.value"placeholder="请选择省":disabled="disableds.provinces"><el-optionv-for="province in provinces.children":key="province.value":label="province.label":value="province.value"></el-option></el-select><el-selectref="selectCitys"v-model="citys.value"placeholder="请选择市":disabled="disableds.citys":default-first-option="true"@change="changeCity"><el-optionv-for="city in citys.children":key="city.value":label="city.label":value="city.value"></el-option></el-select><el-selectref="selectAre
返回列表