![[酷拽]](http://lf-web-assets.juejin.cn/obj/juejin-web/xitu_juejin_web/img/jj_emoji_58.327784e.png)
![[大笑]](http://lf-web-assets.juejin.cn/obj/juejin-web/xitu_juejin_web/img/jj_emoji_55.74ed629.png)
这是一棵小草
前端
获得徽章 0
赞了这篇沸点
我依然喜欢夏天明晃晃的太阳，蒸烤着路人的高温，易碎的日光透过叶子，蝉鸣声叫了整个午后。我喜欢冰镇的西瓜，路边廉价的冰淇淋，和你在烈日下走向我的心情。可是夏天就要过去了，你也渐行渐远了！
2
1
赞了这篇沸点
Vue 事件修饰符详解
1. 常用事件修饰符
1.1 阻止默认行为 (.prevent)
1.2 阻止事件冒泡 (.stop)
1.3 事件只触发一次 (.once)
1.4 串联修饰符
2. 按键修饰符
2.1 常用按键
<input @keyup.enter="submit"> <!-- 回车键 -->
<input @keyup.esc="cancel"> <!-- ESC键 -->
<input @keyup.space="jump"> <!-- 空格键 -->
<input @keyup.tab="nextField"> <!-- Tab键 -->
2.2 系统修饰键
<!-- Alt + C -->
<input @keyup.alt.67="clear">
<!-- Ctrl + Click -->
<div @click.ctrl="doSomething">按住Ctrl点击</div>
2.3 精确修饰符 (.exact)
3. 鼠标按钮修饰符
4. 特殊修饰符
4.1 原生事件 (.native)
4.2 被动模式 (.passive)
5. 表单输入修饰符
5.1 .lazy (change事件替代input事件)
5.2 .number (自动转为数字)
5.3 .trim (自动去除首尾空格)
6. 自定义修饰符
可以通过 config.keyCodes 自定义按键修饰符别名：
Vue.config.keyCodes = {
f1: 112,
// 自定义别名
up: [38, 87]
}
1. 对于表单提交，总是使用 `.prevent` 避免页面刷新
2. 对于嵌套元素的事件处理，合理使用 `.stop` 防止事件冒泡
3. 键盘事件处理时，使用明确的按键修饰符提高可读性
4. 在需要性能优化的滚动事件中使用 `.passive`
这些修饰符可以大大简化事件处理代码，使模板更清晰易读。
1. 常用事件修饰符
1.1 阻止默认行为 (.prevent)
1.2 阻止事件冒泡 (.stop)
1.3 事件只触发一次 (.once)
1.4 串联修饰符
2. 按键修饰符
2.1 常用按键
<input @keyup.enter="submit"> <!-- 回车键 -->
<input @keyup.esc="cancel"> <!-- ESC键 -->
<input @keyup.space="jump"> <!-- 空格键 -->
<input @keyup.tab="nextField"> <!-- Tab键 -->
2.2 系统修饰键
<!-- Alt + C -->
<input @keyup.alt.67="clear">
<!-- Ctrl + Click -->
<div @click.ctrl="doSomething">按住Ctrl点击</div>
2.3 精确修饰符 (.exact)
3. 鼠标按钮修饰符
4. 特殊修饰符
4.1 原生事件 (.native)
4.2 被动模式 (.passive)
5. 表单输入修饰符
5.1 .lazy (change事件替代input事件)
5.2 .number (自动转为数字)
5.3 .trim (自动去除首尾空格)
6. 自定义修饰符
可以通过 config.keyCodes 自定义按键修饰符别名：
Vue.config.keyCodes = {
f1: 112,
// 自定义别名
up: [38, 87]
}
1. 对于表单提交，总是使用 `.prevent` 避免页面刷新
2. 对于嵌套元素的事件处理，合理使用 `.stop` 防止事件冒泡
3. 键盘事件处理时，使用明确的按键修饰符提高可读性
4. 在需要性能优化的滚动事件中使用 `.passive`
这些修饰符可以大大简化事件处理代码，使模板更清晰易读。
展开
3
2
![[可怜]](http://lf-web-assets.juejin.cn/obj/juejin-web/xitu_juejin_web/img/jj_emoji_5.ece2a96.png)
，一个人过晚上下班也打算买个小蛋糕给自己庆祝一下
赞了这篇沸点
赞了这篇沸点