vue组件中$emit()的作用

Question

求大佬告知这种写法有什么作用吗？为什么在每个方法最后都要写上这个，有什么好处？谢谢！望指点！

Answer 1

this.$emit()是用在自定义组件中，作用是命令式地触发该组件实例上的一个自定义事件。

// 自定义组件
// myComponent.vue
...
onUpload () {
    console.log('onUpload')
    this.$emit('beforeUpload')
}
...

// 使用组件
<myComponent @beforeUpload="onMyComponentBeforeUpload"></myComponent>
...
methods: {
    onMyComponentBeforeUpload () {
        console.log('onMyComponentBeforeUpload')
    }
}

在上面组件定义中若调用了onUpload方法，则使用组件地方监听的beforeUpload方法会执行

打印结果如下：

onUpload
onMyComponentBeforeUpload

Answer 2

但凡看过一次文档就不应该问这种问题