关于vue.js:vue2-子组件方法向父组件方法传递子组件调父组件方法父组件调用子组件方法

一: 子组件通过this.$emit()向父组件传递数据
1.在父组件中应用子组件

<media-extra-info 
ref="mediaExtraInfoRef"   
@handleChildMediaChange="handleChildMediaChange"
/>

2.在父组件中定义handleChildMediaChange 办法

handleChildMediaChange(filter_key, filter_val){
  //doing
}

3.在子组件中应用

handleChildMediaChange(val){
        this.$emit("handleChildMediaChange", "child_media_id", val)
      },

二:子组件调用父组件中定义的method办法
this.$parent.parentMethod(params)

三:父组件调用子组件中定义的method 办法, 通过this.$refs调用
1.在父组件中引入子组件,并应用ref 给子组件占位命名”mediaExtraInfoRef”

<media-extra-info 
ref="mediaExtraInfoRef"   
@handleChildMediaChange="handleChildMediaChange"
/>

2.在子组件中定义一个getVal 办法

 getVal(){
        let result = {}
        //doing 
        return result
      },

3.在父组件中须要调用的中央调用子组件的getVal()办法

this.$refs.mediaExtraInfoRef.getVal()

评论

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

这个站点使用 Akismet 来减少垃圾评论。了解你的评论数据如何被处理