Vue + Element-ui的下拉框el-select獲取額外參數(shù)詳解
更新時間：2020年08月14日 09:30:55 作者：myCat、
這篇文章主要介紹了Vue + Element-ui的下拉框el-select獲取額外參數(shù)詳解，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧
直接上代碼吧~
<el-table-column
label="用戶類型"
width="180">
<template slot-scope="scope">
<el-select v-model="scope.row.roleID"
placeholder="請選擇" @change="changeRole($event,scope)">
<el-option
v-for="item in roles"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</template>
</el-table-column>
我想在觸發(fā)下拉框change事件時獲取到scope里的值，因為el-select的change事件默認(rèn)有個回調(diào)參數(shù)，就是選擇的value，如果想額外獲取其他的值不能直接寫@change="changeRole(scope)"，這樣會覆蓋默認(rèn)的參數(shù)，加上$event就可以取到了。
不僅僅是el-select，其余的Element-UI的組件中實現(xiàn)這種不想覆蓋默認(rèn)參數(shù)都可以這樣使用。
補(bǔ)充知識：element UI中的select選擇器的change方法需要傳遞多個值
如果直接調(diào)用change事件，不傳任何參數(shù)，則可以獲取到當(dāng)前選中的值（因為默認(rèn)會將event參數(shù)傳遞過去）
場景：
你需要將select選擇器 ”選中的當(dāng)前元素“ 和 ”其他你需要的值“ 一起傳遞過去？
做法：
change （$event，“你要傳遞的其他值”）
以上這篇Vue + Element-ui的下拉框el-select獲取額外參數(shù)詳解就是小編分享給大家的全部內(nèi)容了，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關(guān)文章
詳解vue父子組件關(guān)于模態(tài)框狀態(tài)的綁定方案
這篇文章主要介紹了詳解vue父子組件關(guān)于模態(tài)框狀態(tài)的綁定方案，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2019-06-06
詳解keep-alive + vuex 讓緩存的頁面靈活起來
這篇文章主要介紹了keep-alive + vuex 讓緩存的頁面靈活起來，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-04-04
在VUE應(yīng)用中,經(jīng)常會使用一些非vue實現(xiàn)的js庫,這些js庫可能要求外部傳入一些界面DOM節(jié)點,本文主要介紹了手動掛載Vue3.0組件到DOM節(jié)點的方法,感興趣的可以了解一下2024-08-08
這篇文章主要介紹了vue學(xué)習(xí)筆記之slot插槽用法,結(jié)合實例形式對比分析了vue使用slot插槽的相關(guān)操作技巧與注意事項,需要的朋友可以參考下2020-02-02
在現(xiàn)代前端開發(fā)中,Vue.js以其高效的響應(yīng)式數(shù)據(jù)綁定和視圖更新機(jī)制著稱,而這一切的核心技術(shù)之一就是虛擬DOM和Diff算法,本文將詳細(xì)介紹虛擬DOM的概念、Diff算法的工作原理,以及Vue如何利用這些技術(shù)高效地更新UI,需要的朋友可以參考下2025-02-02
在vue.config.js中優(yōu)化webpack配置的方法
在日常開發(fā)中我們離不開打包工具webpack,但是不同的配置會影響我們項目的運行構(gòu)建時間,也會影響打包之后項目包的大小,這篇文章記錄一下我使用過的可以優(yōu)化webpack的配置,需要的朋友可以參考下2024-05-05
這篇文章主要介紹了vue 條件渲染v-if和v-show，在模板中，可以根據(jù)條件進(jìn)行渲染。條件用到的是v-if、v-else-if以及v-else來組合實現(xiàn)的，有時候我們想要在一個條件中加載多個html元素，那么我們可以通過template元素上實現(xiàn)，下面就來看看具體實現(xiàn)吧2021-10-10
在本篇文章里小編給各位整理的是一篇關(guān)于vue路由攔截器和請求攔截器知識點總結(jié)文章，有興趣的朋友們學(xué)習(xí)下。2019-11-11
Vue項目如何引入bootstrap、elementUI、echarts
這篇文章主要介紹了Vue項目如何引入bootstrap、elementUI、echarts,文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友可以參考下2020-11-11
vue使用element-ui tabs切換echarts解決寬度100%方式
這篇文章主要介紹了vue使用element-ui tabs切換echarts解決寬度100%方式，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2023-07-07