如图所示 页面:
页面的代码:
配置类型: <el-select v-model="searchConfig" @change="searchSelect(searchConfig)" clearable placeholder="请选择配置类型:"> <el-option v-for="item in configTypeSelect" :key="item.value" :label="item.label" :value="item.value" > </el-option> </el-select>
说明: 其中 searchConfig为绑定的下拉框的value ,@change为select发生改变时触发的事件,configTypeSelect下拉框的数据的数组
configTypeSelect数据格式:
configTypeSelect: [ { value: "黄金糕" }, { value: "双皮奶" }, { value: "蚵仔煎" }, { value: "龙须面" }, { value: "北京烤鸭" }, ]
methods中获取值:
searchSelect(value){ console.log(value) this.searchConfig = value },
如果有多个下拉框 需要v-model绑定不同的value ,这样才能做到数据混淆