在开发中如果获取数据的自身事件对象是这样的,通过方法的e获取
<!-- index.vue -->
<template>
<button @click="handleClick">点击我</button>
</template>
<script>
export default {
methods: {
handleClick(e) {
console.log('事件对象:', e); // $event化身e,携带点击信息
}
}
};
</script>
当时如果我们要传入一个参数并获取e怎么办呢,一开始我想盲试一下用this试一下,结果是不行的,还是直接百度吧
<button @click="handleClick(this,'1')">点击我</button>
原来是需要传入$event就能获取到了,不止对click事件有效,对所以事件都是可以用$event获取对象值的
<button @click="handleClick($event, '额外信息')">点击传递信息</button>
额外知识,取消冒泡事件方法
<!-- 阻止事件冒泡 -->
<button @click.stop="handleClick">只在此处响应</button>
<!-- 阻止默认行为,如链接跳转 -->
<a href="http://example.com" @click.prevent="handleClick">点击不跳转</a>