(vue) el-select选择器的省市级联动
el-select中@change事件
<a-form-model-item label="省份" prop="province">
<a-select v-model="tubeForm.province" placeholder="请选择" @change="provinceChanged">
<a-select-option v-for="(item, index) in provinces" :key="index" :value="item.name">{{
item.name
}}</a-select-option>
</a-select>
</a-form-model-item>
<a-form-model-item label="城市" prop="city">
<a-select v-model="tubeForm.city" placeholder="请选择">
<a-select-option v-for="(item, index) in chsh" :key="index" :value="item.name">{{
item.name
}}</a-select-option>
</a-select>
</a-form-model-item>
data() {
return: {
provinces: [],
chsh: [],
tubeForm: {},
}
},
methods: {
//省份选择
provinceChanged(data) {
for (let a = 0; a < this.provinces.length; a++) {
if (data == this.provinces[a].name) {
this.chsh = this.provinces[a].cities
}
}
},
}
数据格式:
效果: