Vue + Element-ui的下拉框el-select獲取額外引數詳解
阿新 • • 發佈:2020-08-14
直接上程式碼吧~
<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>
我想在觸發下拉框change事件時獲取到scope裡的值,因為el-select的change事件預設有個回撥引數,就是選擇的value,如果想額外獲取其他的值不能直接寫@change="changeRole(scope)",這樣會覆蓋預設的引數,加上$event就可以取到了。
不僅僅是el-select,其餘的Element-UI的元件中實現這種不想覆蓋預設引數都可以這樣使用。
補充知識:element UI中的select選擇器的change方法需要傳遞多個值
如果直接呼叫change事件,不傳任何引數,則可以獲取到當前選中的值(因為預設會將event引數傳遞過去)
場景:
你需要將select選擇器 ”選中的當前元素“ 和 ”其他你需要的值“ 一起傳遞過去?
做法:
change ($event,“你要傳遞的其他值”)
以上這篇Vue + Element-ui的下拉框el-select獲取額外引數詳解就是小編分享給大家的全部內容了,希望能給大家一個參考,也希望大家多多支援我們。