需求說明
八個switch組件,用同一個回調函數
switch組件狀態發生變化時需要知道它目前開關狀態
需要知道當前是哪個switch
問題描述
按照官方文檔對switch事件的描述
| 事件名稱 | 說明 | 回調參數 |
|---|---|---|
| change | switch 狀態發生變化時的回調函數 | 新狀態的值 |
下面這樣寫可以滿足第二個需求,change回調函數中的參數callback就是開關當前的狀態值,默認是boolean類型,但是第三個需求還不能解決.
<el-switch v-model="value1" @change='changeStatus'></el-switch><script> var vm = new Vue({ el: "#app", data: { value1: true }, methods: { change: function(callback){ console.log(callback); } } })</script>解決辦法
下面代碼中的$event就是switch的當前狀態值,而num就是自定義的參數
<el-switch v-model="value1" @change='changeStatus($event,1)'></el-switch><el-switch v-model="value2" @change='changeStatus($event,2)'></el-switch><script> var vm = new Vue({ el: "#app", data: { value1: true, value2: false }, methods: { change: function($event,num){ console.log($event); console.log(num); } } })</script>拓展知識:基于element-ui(vue版)使用switch時change回調函數中的形參傳值問題
需求說明
有多個switch組件
需要知道switch的狀態
表格中當前行(scope.row)的數據
問題描述
官方文檔中對switch中change的描述:

目前能得到switch的狀態值,但是無法得到change回調中第二個形參的值
解決方法:
change回調函數默認形參的實參是$event,其它的實參傳自己需要的數據就ok


以上這篇淺談ElementUI中switch回調函數change的參數問題就是小編分享給大家的全部內容了,希望能給大家一個參考,也希望大家多多支持武林網。
新聞熱點
疑難解答