2024年前端最全VUE 事件修饰符以及按键码，前端开发知识体系

最后

资料过多，篇幅有限

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

自古成功在尝试。不尝试永远都不会成功。勇敢的尝试是成功的一半。

=================================================================================

之前写了一篇关于事件处理的文章，这篇的时间修饰符主要就是来修饰之前事件处理的事件名的，目的是为了扩展事件的功能。

事件修饰符

---

• .stop：阻止单击事件继续传播，event.stopPropagation()

• .prevent：阻止事件默认行为 event.preventDefault()

• .once：点击事件将只会触发一次

事件处理函数 v-on 或者 @

Say {{msg}}

<button @click=“warn(‘王佳伟’,$event)”>Warn

---

事件修饰符

<button @click=“doThis”>单击事件会继续传播

<button @click.stop=“doThis”>单击事件会组织继续传播

<a href=“https://www.cnblogs.com/wjw1014/” @click.prevent=“doStop”>我的博客园博客

<button @click.once=“doOnly”>点击只会触发一次：{{num}}

按键修饰符

---

格式：

v-on:keyup.按键名 或者 @keyup.按键名

常用的按键名：

• .enter 回车键

• .tab Tab键

• .delete Delete键

• .esc ESC键

• space 空格键

• up 向上键

• down 向下键

• left 向左键

• right 向右键

案例：

最后

面试题千万不要死记，一定要自己理解，用自己的方式表达出来，在这里预祝各位成功拿下自己心仪的offer。
开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

达出来，在这里预祝各位成功拿下自己心仪的offer。
开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

[外链图片转存中…(img-Lj1ExSOG-1714984989023)]

[外链图片转存中…(img-T9v8XcWL-1714984989024)]

[外链图片转存中…(img-oZvfx2sJ-1714984989024)]

[外链图片转存中…(img-tEmxyptD-1714984989025)]