vue elementUI el-select 同时获取label 和 value 的值
<template> <el-select v-model="value" placeholder="请选择" clearable filterable @change="selectWorkName"> <!--特别注意@change="selectWorkName" 与@change="selectWorkName()"的区别--> <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" > </el-option> </el-select> </template> <script> export default { name: 'HelloWorld', data () { return { options: [{ value: '选项1', label: '黄金糕' }, { value: '选项2', label: '双皮奶' }, { value: '选项3', label: '蚵仔煎' }, { value: '选项4', label: '龙须面' }, { value: '选项5', label: '北京烤鸭' }], value: '' } }, methods:{ selectWorkName(id){ console.log("select中对应value值",id) let selectedName = {}; selectedName = this.options.find((item)=>{//这里的chargingWorkNameList就是上面遍历的数据源 return item.value === id; //筛选出匹配数据,是对应数据的整个对象 }); console.log(selectedName.label) } } } </script>
vuejs 文章被收录于专栏
里面在vue开发时候遇到的问题与知识点
查看15道真题和解析
智元机器人成长空间 351人发布