vue组件事件命名必须用kebab-case,如@user-updated;需语义清晰、动词开头,避免原生事件名和状态描述,v-model绑定时须匹配update:xxx格式。

Vue 组件事件命名不是随便起个名字就行,核心是让父组件能一眼看懂“这个事件干了什么”,同时和 Vue 的大小写转换机制配合好,避免出错。
事件名必须用 kebab-case(短横线分隔)
这是最硬性的规范。无论你在 defineEmits 里怎么写,在模板中监听时都得用小写加短横线形式,比如 @user-updated、@item-removed。原因很实际:HTML 属性不区分大小写,@userUpdated 和 @userupdated 在 DOM 中会被当成同一个东西,容易出 bug。
- ✅ 正确写法:
@input-changed、@form-submitted - ❌ 错误写法:
@inputChanged、@submit(与原生事件冲突)、@update(太模糊)
语义清晰,动词+名词结构优先
事件名要表达“发生了什么动作”,而不是“状态是什么”。推荐用动词开头,说明组件内部做了什么操作,方便父组件准确响应。

