011.Vue3入门,事件修饰符的使用方法

1、代码如下:

<template>
  <h3>事件修饰符</h3>
  <a @click.prevent="clickHandle" href="http://www.baidu.com">百度</a>
  <div @click="click1"><p @click="click2">测试1</p></div>
  <div @click="click1"><p @click.stop="click2">测试2</p></div>
</template>

<script>
export default {
  data() {
    return {}
  },
  methods: {
    clickHandle(e) {
      console.log("点击了!");
      console.log(e);
    },
    click1() {
      console.log("外标签点击");
    },
    click2() {
      console.log("内标签点击");
    }
  }
}
</script>

2、测试如下

 

posted @ 2024-08-10 17:48  像一棵海草海草海草  阅读(2)  评论(0编辑  收藏  举报