如何取到el-select中的label

在el-select中咱們通常都是取到value的值，可是有時候咱們須要value和label都須要。那怎麼方便的取到呢

在網上常常有ref="cascader"這個方法，可是通過本人屢次驗證有時候這種方法不太穩定。因此還有其餘兩種方法下面說一下：

通常el-select的寫法是這樣的

　　　　　　　 <el-select v-model="searthareathree" size="small" filterable placeholder="請選擇區域">
              <el-option ref="cascader" v-for="item in optionsZonethree" :key="item.district_id" :label="item.district_name" :value="item.district_id">
              </el-option>
            </el-select>

咱們給一種方法能夠經過for循環經過與取中的model對比，取到對應的label;以下所示：

 pushfranchisee(){ for(let a=0;a<this.optionsZonethree.length;a++){ if(this.searthareathree==this.optionsZonethree[a].district_id){ this.labelname=this.optionsZonethree[a].district_name } } }

這樣this.labelname就是要取到的label的值了，可是這種方法在數據少的時候還好，可是可是數據多的時候可能加載時間會長一點；

因此咱們還能夠用一種新方法find來解決

let selectName=this.optionsZonethree.find(val=>val.district_id==this.searthareathree).district_name console.log(selectName)

這樣就能夠直接打印出來label的值了

下面說一下find方法

 

find()方法返回數組中符合的第一個值，效果和swith相似，可是簡單不少，

用法：

array.find(function(currentValue, index, arr),thisValue)
參數：

currentValue 必需。當前元素

index 可選。當前元素的索引值
arr 可選。當前元素所屬的數組對象
thisValue 可選。 傳遞給函數的值通常用 "this" 值。
若是這個參數爲空， "undefined" 會傳遞給 "this" 值

方法返回值：返回符合測試條件的第一個數組元素值，若是沒有符合條件的則返回 undefined。
EG:
var ages = [4, 12, 16, 20];
 function checkAdult(age) { 
　　return age >= document.getElementById("ageToCheck").value; 
} 
function myFunction() { 
　　document.getElementById("demo").innerHTML = ages.find(checkAdult); 
}就是這些了，但願對你有幫助