VUE 中$event 实现同时传递数据和事件

89 阅读1分钟

非常惭愧,学艺不精,到现在才发现这个问题的解决办法,之前的处理方式一直停留在要么传数据,要么传事件。某些场合更适合同时传递事件和数据,但走了一些弯路也实现了功能,今天不能再这样了,今天要站起来了。关键在于$event的使用

传递数据

<div @click="fnName(实参一,实参二···)"></div>

methods:{
    fnName(形参一,形参二···){
        console.log(形参一,形参二,***)
    }
}

传递事件

<div @click="fnName"></div>

methods:{
    fnName(e){
        console.log(e.target)
        ***
    }
}

同时传递数据和事件

<div @click="fnName(实参一,$event)"></div>

methods:{
    fnName(形参一,形参二){
        console.log(形参一)         // 数据
        console.log(形参二.target)  // 事件
    }
}