美文网首页
VUE父组件监听子组件事件,同时传入参数

VUE父组件监听子组件事件,同时传入参数

作者: 球场贵公子 | 来源:发表于2020-03-19 11:30 被阅读0次

    子组件用$emit携带参数向父组件传递事件,并且父组件在监听到事件的同时又需要传入参数,这种时候该怎么实现呢?

    vue提供了两种方法可以使得父组件在使用子组件的同时也传入值。

    情况1.子组件传单个参数

    子组件:

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

    父组件

    
    @test='handleTest($event,userDefined)'
    
    methods:{
    
        handleTest(childParam,fatherParam){
    
            console.log(childParam)//'子组件参数'
    
        }
    
    }
    
    

    情况2.子组件传多个参数

    子组件:

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

    父组件

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

    相关文章

      网友评论

          本文标题:VUE父组件监听子组件事件,同时传入参数

          本文链接:https://www.haomeiwen.com/subject/lgbkyhtx.html