Vue 父子组件传值$emit传值情况

Vue父子组件传值已经是项目中和在面试中经常碰见的老话题了，可是时常也有弄混的情况。话不多说，直接开干。

$emit传一个值

子组件

this.$emit('showChange', false)

父组件

<div @showChange="showChange">
</div>
或者
<div @showChange="showChange($event)">
</div>
showChange(value){
    this.value = value
}

$emit传多个值

子组件

this.$emit('showChange', false, true) 或者 this.$emit('showChange', {false, true})

父组件 注意：多个值时，为了避免出现问题，推荐以下写法

<div @showChange="showChange(arguments)">
</div>
showChange(arguments){
    this.value1 = arguments[0]
    this.value2 = arguments[1]
}

showChange(arguments){
    this.value1 = arguments.a
    this.value2 = arguments.b
}

arguments是一个数组,取的其中相对应的值就可以
下一期讲会讲讲 props、$ref这两种传值方式
如果对你有帮助的话，麻烦你敲代码的灵活双手点个赞或者留下你的想法打在评论区。会互相学习进步了，谢谢~