2026-01-15 vue 基础入门 , 全局事件总线 , mitt , provide/inject , 子父组件通信 , 订阅-发布模式 , 跨层级通信 17 分钟阅读Vue3跨组件通信中,全局事件总线与provide/inject该如何正确选择?Vue3跨组件通信方案:①全局事件总线用mitt实现“订阅-发布”,创建共享实例,发布用emit,订阅用on,销毁时off防内存泄漏;②provide/inject支持跨层级通信,祖先用provide提供数据/方法,后代用inject获取;③子父通信用defineEmits定义事件,emit发射,父组件@监听事件。阅读更多 cmdragon
2026-01-13 vue 基础入门 , 表单事件处理 , v-model , 表单提交验证 , 输入框双向绑定 , 复选框 , 单选框 16 分钟阅读Vue3表单事件处理:v-model如何实现数据绑定、验证与提交?Vue3表单事件处理中,v-model实现输入框双向绑定,配合.lazy延迟更新、.number转为数字、.trim去除空格修饰符定制行为。表单提交用@submit.prevent阻止默认刷新,结合验证逻辑确保数据合法。单选框绑定单个值,复选框组绑定数组、单个绑定布尔值,支持change事件监听。阅读更多 cmdragon
2026-01-13 vue 基础入门 , Vue事件处理 , 事件委托 , 事件修饰符 , 事件冒泡 , 捕获阶段 , 事件目标阶段 13 分钟阅读Vue应用如何基于DOM事件传播机制与事件修饰符实现高效事件处理?DOM事件传播分捕获、目标、冒泡三阶段,Vue默认在冒泡阶段处理事件。利用冒泡机制实现事件委托优化性能,将监听器绑在父元素。事件修饰符(如.stop、.prevent等)可简化处理,支持叠加使用,文中还涉及常见修饰符组合场景及报错处理方法。阅读更多 cmdragon
2026-01-12 vue 基础入门 , 键盘事件 , keydown , keyup , 按键修饰符 , 组合快捷键 , 事件处理 14 分钟阅读Vue3键盘事件处理:如何通过keydown/keyup与修饰符实现从基础交互到组合快捷键的全场景覆盖?Vue3键盘事件处理包含keydown(按下触发,长按连续触发)与keyup(松开触发,单次触发),前者适实时搜索等场景,后者用于提交表单。常用按键修饰符(如.enter、.tab)替代keyCode,组合快捷键(Ctrl+S、Shift+Enter)通过修饰符实现,代码简洁,可通过prevent等修饰符阻止默认行为,解决按键不生效、组合快捷键不触发等问题。阅读更多 cmdragon
2026-01-11 vue 基础入门 , 事件处理 , 参数传递 , 内联事件处理 , $event , 原生事件 , 参数顺序 14 分钟阅读Vue3中如何在调用事件处理函数时同时传递自定义参数和原生DOM事件?参数顺序有哪些注意事项?Vue3中事件处理函数传参,多用内联调用(如@click=“say(‘参数’)")传递自定义参数。需原生事件时用$event或箭头函数(如@click=“warn(‘消息’, $event)“或(e)=>warn(‘消息’,e)),参数 …阅读更多 cmdragon
2026-01-10 vue 基础入门 , DOM事件流 , stop修饰符 , prevent修饰符 , capture修饰符 , once修饰符 , passive修饰符 15 分钟阅读从捕获到冒泡:Vue事件修饰符如何重塑事件执行顺序?DOM事件流分捕获、目标、冒泡三阶段,Vue默认冒泡阶段触发事件。事件修饰符改变这一行为:.stop(阻止冒泡)、.prevent(阻止默认行为)、.capture(捕获阶段触发)、.passive(优化滚动性能)、.once(只触发一次)。修饰符可串联,如.click.stop.prevent。阅读更多 cmdragon