溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
需求說明
八個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的參數問題就是小編分享給大家的全部內容了，希望能給大家一個參考，也希望大家多多支持億速云。
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
