原文网址：Element-UI--＜el-switch＞的@change回调函数的参数用法_IT利刃出鞘的博客-CSDN博客

简介

说明

        本文介绍Element-UI的<el-switch>的@change回调函数的参数用法    
    
    
。

需求

2个switch组件
    
    
    ，用同一个回调函数 switch组件状态发生变化时需要知道它目前开关状态 需要知道当前是哪个switch

问题：不传递参数时只能知道开关状态

官方文档对switch事件的描述

事件名称 说明 回调参数 change switch 状态发生变化时的回调函数 新状态的值

代码

<template> <div> <el-switch v-model="value1" @change="changeStatus" > </el-switch> </div> </template> <script> export default { name: Demo, data () { return { value1: false } }, methods: { changeStatus (status) { console.log(事件) console.log(status) } } } </script> <style scoped> </style>

测试

解决方案：传递$event和其他参数

$event会包含开关状态的值     


     


     


，可以将它作为参数 


     


     


    。另外可以指定其他参数

 




 




 


。

<template> <div> <el-switch v-model="value1" @change="changeStatus($event, 1)" > </el-switch> </div> </template> <script> export default { name: Demo, data () { return { value1: false } }, methods: { changeStatus ($event, switchNum) { console.log(事件) console.log($event) console.log(序号) console.log(switchNum) } } } </script> <style scoped> </style>

测试（可以获取开关状态和当前是第几个按钮）

其他网址

ElementUI中switch回调函数change的参数问题_fool_dawei的博客-CSDN博客