vue.js用select实现省，市，提交后，默认显示省，市信息
Posted 小短腿奔跑吧
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了vue.js用select实现省，市，提交后，默认显示省，市信息相关的知识，希望对你有一定的参考价值。
<select v-model="citys" name="cityVal" @change="schoolName(citys)">
<option v-for="(item,index) in city" :value="item.val" v-text="item.name" ></option>
</select>
<select v-model="schools" name="schoolVal">
<option v-for="(item,index) in school" :value="item.val" v-text="item.name" ></option>
</select>
<script>
var vue = new Vue({
el: ‘#body‘,
data: function() {
return {
city: [{
val: ‘0‘,
name: ‘城市‘
}],
citys: 0,
school: [{
val: ‘0‘,
name: ‘高校‘
}],
schools: 0,
schoolAjax:‘‘
}
},
methods: {
cityName: function() {
var this_obj = this;
$.ajax({
type: "post",
url: $app+"/Clan/city",
dataType: "json",
success: function(res) {
if(res.status) {
$.each(res.info,function(k, v) {
this_obj.city.push({
name:v.ar_name,
val:v.ar_id,
})
})
} else {
}
},
error: function() {
$.alert({
msg: ‘传输错误1‘
})
}
});
},
schoolName: function(citys) {
var this_obj = this;
var data = { ar_id:citys};
$.ajax({
type: "post",
data:data,
url: $app+"/Clan/school",
dataType: "json",
success: function(res) {
this_obj.school=[{ val: ‘0‘,name: ‘高校‘}]
if(res.status) {
$.each(res.info,function(k, v) {
this_obj.school.push({
val:v.sc_id,
name:v.sc_name
})
});
this_obj.schools=this_obj.schoolAjax;
} else {
},
error: function() {
$.alert({
msg: ‘传输错误7‘
})
}
});
},
defules:function(){
var this_obj = this;
$.ajax({
type: "post",
url: $app+"/Call/team_user",
dataType: "json",
success: function(res) {
console.log(res.info);
if(res.status) {
this_obj.schoolName(res.info.us_arid);
this_obj.schoolAjax=res.info.us_scid;
} else {
}
},
error: function() {
$.alert({
msg: ‘传输错误5‘
})
}
});
}
}
})
vue.cityName();
vue.defules();
以上是关于vue.js用select实现省，市，提交后，默认显示省，市信息的主要内容，如果未能解决你的问题，请参考以下文章