参考:Vue2 el-select下拉框,默认选择第一个值_猫小黑呀的博客-CSDN博客_select下拉框默认选中第一个
el-select下拉框基本写法:
<el-form :inline="true" :model="formInline" class="demo-form-inline">
<el-form-item label="名称">
<el-select v-model="formInline.stationName" @change="onTitleChange">
<el-option v-for="(item,index) in formInline.station" :label="item.station_name" :value="item.station_id"
:key="item.station_id"></el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search">查询</el-button>
</el-form-item>
</el-form>
export default {
name: 'Corporate-Contacts',
data() {
return {
formInline: {
station: [], //station_id的值
station_Name: '', // name
station_Id:'' // 配点站的id
}
}
},
}
分下下分别为三部分:
<el-form :model="formInline" class="demo-form-inline">
</el-form>
<el-select v-model="formInline.stationName" @change="onTitleChange">
</el-select>
<el-option
v-for="(item,index) in formInline.station"
:label="item.station_name"
:value="item.station_id"
:key="item.station_id"
>
</el-option>
第一部分是综合的model,第二部分是你选中的,第三部分下下拉要展示的
复杂的混合模式,嵌套两个下拉框:
<el-form :inline="true" :model="formInline" class="demo-form-inline">
<el-select v-model="formInline.stationName.station_Name" @change="onTitleChange">
<el-option v-for="(item,index) in formInline.stationName.station" :label="item.stationName.station_name" :value="item.stationName.station_id"
:key="item.station_id"></el-option>
</el-select>
<el-select v-model="formInline.TestName.name" @change="inTitleChange">
<el-option v-for="(item,index) in formInline.TestName.station" :label="item.TestName.name" :value="item.TestName.id"
:key="item.station_id"></el-option>
</el-select>
</el-form>
export default {
name: 'Corporate-Contacts',
data() {
return {
formInline: {
stationName:[
station: [], //station_id的值
station_Name: '', // name
station_Id:'' // 配点站的id
],
TestName:[
station: [], //station_id的值
Name: '', // name
Id:'' // 配点站的id
],
}
}
},
}
你想获取下拉框的所有内容,对应this.formInline.stationName和this.formInline.TestName
你想获取当前选中了哪个,this.formInline.stationName.station_Name和this.formInline.TestName.Name
默认选中第几项this.formInline.stationName[0].station_Name和this.formInline.TestName[0].Name