主页

uniapp的事件获取自身对象并传多个参数,$event化身e

春日寄信给你   IP属地: 青海
0 点赞 0阅读 1554

在开发中如果获取数据的自身事件对象是这样的,通过方法的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>



© 著作权归作者所有,转载或内容合作请联系作者