vue 父组件监听子组件事件,emit携带参数,且父组件也自带参数问题

很多时候用$emit携带参数传出事件,并且又需要在父组件中使用自定义参数时,这时我们就无法接受到子组件传出的参数了。
找到了两种方法可以同时添加自定义参数的方法。

方法一

子组件传出单个参数时:

// 子组件

this.$emit('test','子组件参数')

// 父组件

@test='handleTest($event,fatherParam)'

methods:{
    handleTest(childParam,fatherParam){
        console.log(childParam) //'子组件参数'
    }
}

方法二

子组件传出多个参数时:
// 子组件

this.$emit('test','子参1','子参2')

// 父组件

@test='handleTest(arguments,userDefined)'
methods:{
    handleTest(childParams,fatherParam){
        console.log(childParams[0]) //'子参1'
        console.log(childParams[1]) //'子参2'
    }
}

你可能感兴趣的:(vue 父组件监听子组件事件,emit携带参数,且父组件也自带参数问题)