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开发时候遇到的问题与知识点

全部评论

相关推荐

评论
点赞
收藏
分享

创作者周榜

更多
牛客网
牛客网在线编程
牛客网题解
牛客企业服务