element-ui 關(guān)于獲取select 的label值方法
更新時(shí)間：2018年08月24日 11:05:11 作者：勤讀意現(xiàn)
今天小編就為大家分享一篇element-ui 關(guān)于獲取select 的label值方法，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來看看吧
在某些場(chǎng)景下，還是需要在獲得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;
},
這可以獲得相應(yīng)的值減少其他數(shù)據(jù)庫的操作。
拓展知識(shí)：Element ui select同時(shí)獲取value和label的值的實(shí)例
如下所示：
<el-form-item v-if="isMD" label="業(yè)務(wù)員名稱">
<el-select v-model="addBM.storeManagerName" @change="selectGet" filterable style="display:block;" placeholder="請(qǐng)選擇門店業(yè)務(wù)員名稱">
<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){//這個(gè)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就是對(duì)應(yīng)label的
}
以上這篇element-ui 關(guān)于獲取select 的label值方法就是小編分享給大家的全部?jī)?nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。
相關(guān)文章
本篇文章主要介紹了vuex 閑置狀態(tài)重置方案，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2018-01-01
vue2.0.js的多級(jí)聯(lián)動(dòng)選擇器實(shí)現(xiàn)方法
下面小編就為大家分享一篇vue2.0.js的多級(jí)聯(lián)動(dòng)選擇器實(shí)現(xiàn)方法，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來看看吧2018-02-02
Vue報(bào)錯(cuò)ERR_OSSL_EVP_UNSUPPORTED解決方法
Vue項(xiàng)目啟動(dòng)時(shí)報(bào)錯(cuò)ERR_OSSL_EVP_UNSUPPORTED,本文主要介紹了Vue報(bào)錯(cuò)ERR_OSSL_EVP_UNSUPPORTED解決方法,具有一定的參考價(jià)值,感興趣的可以了解一下2024-08-08
這篇文章主要介紹了vue3+ts中定義ref變量,設(shè)置變量類型方式,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2024-03-03
Vue.js（讀音 /vjuː/, 類似于 view） 是一套構(gòu)建用戶界面的漸進(jìn)式框架。這篇文章主要介紹了Vue.js用法詳解,需要的朋友可以參考下2017-11-11
vue?this.$router六種方法使用示例總結(jié)分析
這篇文章主要為大家介紹了vue this.$router六種方法使用示例總結(jié)分析，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2023-06-06
如何在vite初始化項(xiàng)目中安裝scss以及scss的使用
今天想要給vite項(xiàng)目,添加全局的scss變量文件引用,這樣我們?cè)谑褂胹css變量和函數(shù)的時(shí)候就不需要每個(gè)組件都取引用了,下面這篇文章主要給大家介紹了關(guān)于如何在vite初始化項(xiàng)目中安裝scss以及scss使用的相關(guān)資料,需要的朋友可以參考下2022-10-10
vue-virtual-scroller是一個(gè)高度可定制的虛擬滾動(dòng)列表插件，它可以在大量數(shù)據(jù)下提供高性能的渲染和滾動(dòng)，這篇文章主要介紹了vue-virtual-scroller 的使用,需要的朋友可以參考下2023-07-07
vue兩組件間值傳遞 $router.push實(shí)現(xiàn)方法
兩組件間傳值，可能包含多種情況，這篇文章主要介紹了vue兩組件間值傳遞 $router.push實(shí)現(xiàn)方法，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2019-05-05
Element樹形控件整合帶圖標(biāo)的下拉菜單(tree+dropdown+input)
Element UI 官網(wǎng)提供的樹形控件包含基礎(chǔ)的、可選擇的、自定義節(jié)點(diǎn)內(nèi)容的、帶節(jié)點(diǎn)過濾的以及可拖拽節(jié)點(diǎn)的樹形結(jié)構(gòu)，本文實(shí)現(xiàn)了樹形控件整合帶圖標(biāo)的下拉菜單，感興趣的可以了解一下2021-07-07