javascript - element-ui(Vue.js) 我在做二级select联动时选中值是循环的value怎么解?
本文介绍了javascript - element-ui(Vue.js) 我在做二级select联动时选中值是循环的value怎么解?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
问 题
代码不多,我直接贴上来
<el-col :span="6">
<div class="grid-content bg-purple">
<el-select
v-model="selectSchool"
placeholder="请选择学校"
v-on:change="getClasses()">
<el-option
v-for="item in schools"
:label="item.label"
value="item.value">
</el-option>
</el-select>
</div>
</el-col>
<el-col :span="6">
<div class="grid-content bg-purple">
<el-select
v-model="selectClass"
placeholder="请选择班级"
v-on:change="getStudents()">
<el-option
v-for="item in classes"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</div>
</el-col>
以上是HTML部分
以下是js部分
<script>
new Vue({
el: '#app',
data (){
return {
dialogTable: false,
typed: 'class',
classType: true,
phoneType: false,
phone: '',
userList: [],
schools: [],
classes: [],
students:[],
selectStudent: '',
selectSchool: '',
selectClass: '',
}
},
methods: {
getClasses: function () {
var url = "{{URL::route('xxxx.xxxx',['sid'=>""])}}"+this.selectSchool;
this.$http.get(url).then((response) => {
console.log(this.selectSchool,this.classes);
this.classes = response.data.data;
});
},
getStudents: function () {
var url = "{{URL::route('xxxx.xxxxx',['cid'=>""])}}"+this.selectClass;
this.$http.get(url).then((response) => {
console.log(response.data.data);
this.students = response.data.data;
});
},
changeType: function () {
console.log(this.typed);
if (this.typed == 'class') {
this.phoneType = false;
this.classType = true;
} else {
this.classType = false;
this.phoneType = true;
}
},
queryPhone: function () {
},
queryClass: function () {
}
},
mounted (){
var url = "{{URL::route('xxxx.xxxx')}}";
this.$http.get(url).then((response) => {
console.log('ready');
this.schools = response.data.data;
});
}
});
</script>
当mounted的时候第一个选框有了内容,然后当我选择一个内容后触发getClasses这个方法的时候,第一个选框的选项全部变成蓝色(就像全部选中),打印selectSchools值是 item.value
后端接口没问题可以确定。
js弱,活儿又紧,求帮助。
这个问题已被关闭,原因:问题已解决 - 问题已解决,且对他人无借鉴意义
解决方案
selectSchool
中的option
的value
是忘记加:了还是你代码粘贴错了。。。
这篇关于javascript - element-ui(Vue.js) 我在做二级select联动时选中值是循环的value怎么解?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文