(vue) el-select选择器的省市级联动

nyf_unknown

已于 2022-07-25 11:44:52 修改

阅读量1.2k

点赞数

分类专栏： VUE 文章标签： vue.js 前端 javascript

于 2022-06-13 19:53:38 首次发布

本文链接：https://blog.csdn.net/qq_44754635/article/details/125266230

版权

VUE 专栏收录该内容

187 篇文章 2 订阅

订阅专栏

(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
        }
      }
    },
}