vue函数@click.prevent使用纪要
背景:vue项目操作中遇到@click.prevent函数,场景特殊(项目中有一个自己封装的组件库,因此所有的样式都统一集成,遇到特殊情况想引入特殊UI风格处理时,部分组件需要样式重调,因此用到@click.prevent)特此纪要。问题:@click.prevent的作用是什么?说明:@click.prevent属于vue的内置函数,vue中有很多其他的函数也有很丰富的应用场景,此篇博文思虑再三
·
背景
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回车事件)等等。
更多推荐
已为社区贡献2条内容
所有评论(0)