在使用element ui时 select组件获取label问题

标签：添加   9.png   label   val   技术   hang   segment   存储   UI   

最近在工作的时候需要实现多个条件联合查询，这个其实就是一条sql语句。但是，我们数据库中存储的是根据前端传来id的值所对应的值，而不是直接存的id，使用select组件时，却只能取到value值，无法作为后台查询的条件。

我们需要的是select 组件的label值，而不是看不见的value值。

首先，根据element ui select组件使用手册，给组件添加‘change‘方法

1 @change=changeValue

再根据Array 的 find方法找出对应的值即可。

1 changeValue(value) {
2     console.log(value);
3       let obj = {};
4       obj = this.options.find((item)=>{
5           return item.value === value;
6       });
7       console.log(obj.label);
8 }

这里需要注意的是，code中‘this.options‘代表的是你需要获取label值的数组，‘item.value‘的‘value‘代表的是你数组中跟label对应的遍历的属性名。最后返回的item就是找到的对象。哦，还有就是‘obj.label‘的是数组中对应的显示的属性名。

小白勿喷~

参考文章：https://segmentfault.com/q/1010000009693531/a-1020000009696270

在使用element ui时 select组件获取label问题

标签：添加   9.png   label   val   技术   hang   segment   存储   UI   

原文地址：http://www.cnblogs.com/5icuke/p/7568723.html