<FormItem prop="province" label="省份">
<Select v-model="formValidate.province" placeholder="请选择省份" @on-change="changeProvince"> <Option v-for="(item,index) in provinceArr" :key="item.value" :value="item.value" >{{ item.label }}</Option>
</Select>
</FormItem>
<FormItem prop="city" label="城市">
<Select v-model="formValidate.city" placeholder="请选择城市" @on-change="changeCity">
<Option v-for="(item,index) in citiesArr" :key="item.value" :value="item.value" >{{ item.label }}</Option>
</Select>
</FormItem>
污泥制砖<FormItem prop="county" label="区县">
<Select v-model="unty" placeholder="请选择区县">
<Option v-for="(item,index) in countyArr" :key="item.value" :value="item.value" >{{ item.label }}</Option>
</Select>
</FormItem>
使⽤@on-change事件进⾏联动
vue读取本地省市区json⽂件
created(){
this.$('localhost:8080/static/json/provinces.json').then((data) => {
this.provinceArr = data.data.data
纳达尔资料
})
}
不知道有没更好的获取办法，⽹上了好久，省市区json是在⽹上的，然后⾃⼰修改了⼀点，链接：
需要的js部分代码
<script>
export default {
孔刚玉data(){
return{
provinceArr: [],
citiesArr: [],
countyArr:[],
ruleValidate: {
province: [
{ required: true, message: '请选择收货地所属的省份', trigger: 'change' } ], city: [
{ required: true, message: '请选择收货地所属的市', trigger: 'change' } ],
county: [
{ required: true, message: '请选择收货地所属的区县', trigger: 'change' } ],
}
}
},
created(){
this.$('localhost:8080/static/json/provinces.json').then((data) => { this.provinceArr = data.data.data
})
},
methods: {
changeProvince(val){
for(var i=0; i<this.provinceArr.length; i++){
if(val == this.provinceArr[i].value ){
this.citiesArr = this.provinceArr[i].children
unty = ''
}
}
},
changeCity(val){
for(var i=0; i<this.citiesArr.length; i++){
if(val == this.citiesArr[i].value ){
}羟基自由基
}西安税企通
全民开讲
}
}
}
</script>
效果图
豫公网安备41160202000603
站长QQ:729038198
关于我们
投诉建议