element-ui 關于獲取select 的label值方法
更新時間:2018年08月24日 11:05:11 作者:勤讀意現(xiàn)
今天小編就為大家分享一篇element-ui 關于獲取select 的label值方法,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧
在某些場景下,還是需要在獲得label的值跟Value值的。
vue獲取值的方式:
<el-form-item label="庫位" prop="goodsLocationId" >
<el-col :span="15">
<el-select v-model="scope.row.goodsLocationId" placeholder="貨位地址" @change="changeLocationValue">
<el-option v-for="lo in locations" :label="lo.locationName" :value="lo.id" :key="lo.id"></el-option>
</el-select>
</el-col>
</el-form-item>
js:
changeLocationValue(val){
//locations是v-for里面的也是datas里面的值
let obj = {};
obj = this.locations.find((item)=>{
return item.id === val;
});
this.wareHouseVO2.goodsLocationName = obj.locationName;
},
這可以獲得相應的值減少其他數(shù)據(jù)庫的操作。
拓展知識:Element ui select同時獲取value和label的值的實例
如下所示:
<el-form-item v-if="isMD" label="業(yè)務員名稱">
<el-select v-model="addBM.storeManagerName" @change="selectGet" filterable style="display:block;" placeholder="請選擇門店業(yè)務員名稱">
<el-option
v-for="item in userList"
:key="item.id"
:label="item.name"
:value="item.id">
</el-option>
</el-select>
</el-form-item>
//下拉框選中事件
selectGet(vId){//這個vId也就是value值
console.log(ha);
let obj = {};
obj = this.userList.find((item)=>{//這里的userList就是上面遍歷的數(shù)據(jù)源
return item.id === vId;//篩選出匹配數(shù)據(jù)
});
console.log(obj.name);//我這邊的name就是對應label的
}
以上這篇element-ui 關于獲取select 的label值方法就是小編分享給大家的全部內(nèi)容了,希望能給大家一個參考,也希望大家多多支持腳本之家。
相關文章
vue2.0.js的多級聯(lián)動選擇器實現(xiàn)方法
下面小編就為大家分享一篇vue2.0.js的多級聯(lián)動選擇器實現(xiàn)方法,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2018-02-02
Vue報錯ERR_OSSL_EVP_UNSUPPORTED解決方法
Vue項目啟動時報錯ERR_OSSL_EVP_UNSUPPORTED,本文主要介紹了Vue報錯ERR_OSSL_EVP_UNSUPPORTED解決方法,具有一定的參考價值,感興趣的可以了解一下2024-08-08
vue兩組件間值傳遞 $router.push實現(xiàn)方法
兩組件間傳值,可能包含多種情況,這篇文章主要介紹了vue兩組件間值傳遞 $router.push實現(xiàn)方法,小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2019-05-05
Element樹形控件整合帶圖標的下拉菜單(tree+dropdown+input)
Element UI 官網(wǎng)提供的樹形控件包含基礎的、可選擇的、自定義節(jié)點內(nèi)容的、帶節(jié)點過濾的以及可拖拽節(jié)點的樹形結構,本文實現(xiàn)了樹形控件整合帶圖標的下拉菜單,感興趣的可以了解一下2021-07-07

