20250331-vue-组件事件1触发与监听事件

触发与监听事件

1

在组件的模板表达式中，可以直接使用 $emit 方法触发自定义事件(例如：在 v-on 的处理函数中)：

子组件代码

父组件代码

2

$emit() 方法在组件实例上也同样以 this.$emit() 的形式可用：

父组件代码不变，子组件代码如下

3

组件的事件监听器也支持 .once 修饰符：

父组件这句改为

这样点击效果就只会出现一次。

4

像组件与 prop 一样，事件的名字也提供了自动的格式转换。像3中的代码也可以这样写

5

和原生DOM事件不一样，组件触发的时间没有冒泡机制。你只能监听直接子组件触发的事件。平级组件或是跨越多层嵌套的组件间通信，应使用一个外部的事件总线，或是使用一个全局状态管理方案。