vue函数@click.prevent使用纪要

背景

vue项目操作中遇到@click.prevent函数，场景特殊（项目中有一个自己封装的组件库，因此所有的样式都统一集成，遇到特殊情况想引入特殊UI风格处理时，部分组件需要样式重调，因此用到@click.prevent）特此纪要。

问题

@click.prevent的作用是什么？

说明

@click.prevent属于vue的内置函数，vue中有很多其他的函数也有很丰富的应用场景，此篇博文思虑再三，仅对@click.prevent进行阐述，有关其他的函数了解，可自行查阅相关资料。

解决方案

@click.prevent函数会阻止触发dom的原始事件，而去执行特定的事件。为了更好的理解@click.prevent函数，引入一个项目中的使用样例以供参考：

<!-- 样例 -->
  // Codding...
  <a class="img-control" v-show="true" @click.prevent="goXxxx()">修改</a>
<!-- 
    解析：
        a标签默认有自己的href属性，触发a标签后他会自动跳转对应的链接地址或执行的函数。
        此处为了嵌套，避免调整样式所以引用了a标签来处理，但又为了避免a标签的属性限制，因此引用了@click.prevent函数阻隔默认的操作。
        （此处还想做一些延伸说明，但目前没有太多的案例来很好的说明，后续再做更新，目前只到这里）
 -->

vue还有几个常用的函数，如：@keyup.enter（enter回车事件）等等。