[Vue]事件修饰符

如有错误，请指正！！！

一、语法介绍

1、问题来源
       我们在处理网页时，当点击按钮时会触发对应事件，但是有时并不想触发该时间，此时就需要事件修饰符对事件进行限定。
2、解决办法
       Vue 为解决这一问题，Vue 为 v-on 提供了事件修饰符。修饰符是用 . 表示的指令后缀，包含以下这些：

• .stop
• .prevent
• .self
• .capture
• .once
• .passive

二、添加代码

<template>
    <h3>事件修饰符</h3>
    <!-- 此时只会触发clickHandle,不触发后面的跳转网页事件 -->
  <a @click.prevent="clickHandle" href ="https://www.baidu.com/index.htm">百度</a>
</template>
     
     
  <script>
export default {
  // 变量声明
  data() {
    return {
    }
  },

  methods: {
     // enent对象
     clickHandle() {
      // vue中的event对象就是js中的enent对象
     console.log("点击了");
    }
  }
}
</script>

三、结果展示

略

四、参考文献

[1] vue.js