Vue + Element-ui的下拉框el-select獲取額外參數(shù)詳解
直接上代碼吧~
<el-table-column label='用戶類型' width='180'> <template slot-scope='scope'> <el-select v-model='scope.row.roleID' placeholder='請(qǐng)選擇' @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事件時(shí)獲取到scope里的值,因?yàn)閑l-select的change事件默認(rèn)有個(gè)回調(diào)參數(shù),就是選擇的value,如果想額外獲取其他的值不能直接寫@change='changeRole(scope)',這樣會(huì)覆蓋默認(rèn)的參數(shù),加上$event就可以取到了。
不僅僅是el-select,其余的Element-UI的組件中實(shí)現(xiàn)這種不想覆蓋默認(rèn)參數(shù)都可以這樣使用。
補(bǔ)充知識(shí):element UI中的select選擇器的change方法需要傳遞多個(gè)值
如果直接調(diào)用change事件,不傳任何參數(shù),則可以獲取到當(dāng)前選中的值(因?yàn)槟J(rèn)會(huì)將event參數(shù)傳遞過(guò)去)
場(chǎng)景:
你需要將select選擇器 ”選中的當(dāng)前元素“ 和 ”其他你需要的值“ 一起傳遞過(guò)去?
做法:
change ($event,“你要傳遞的其他值”)
以上這篇Vue + Element-ui的下拉框el-select獲取額外參數(shù)詳解就是小編分享給大家的全部?jī)?nèi)容了,希望能給大家一個(gè)參考,也希望大家多多支持好吧啦網(wǎng)。
相關(guān)文章:
1. JSP之表單提交get和post的區(qū)別詳解及實(shí)例2. CSS可以做的幾個(gè)令你嘆為觀止的實(shí)例分享3. Xml簡(jiǎn)介_(kāi)動(dòng)力節(jié)點(diǎn)Java學(xué)院整理4. jsp+servlet實(shí)現(xiàn)猜數(shù)字游戲5. javascript xml xsl取值及數(shù)據(jù)修改第1/2頁(yè)6. 低版本IE正常運(yùn)行HTML5+CSS3網(wǎng)站的3種解決方案7. jsp文件下載功能實(shí)現(xiàn)代碼8. 將properties文件的配置設(shè)置為整個(gè)Web應(yīng)用的全局變量實(shí)現(xiàn)方法9. ASP常用日期格式化函數(shù) FormatDate()10. JSP+Servlet實(shí)現(xiàn)文件上傳到服務(wù)器功能
