vue 中 父组件和子组件互相调用方法

父组件如何调用子组件的方法：

 

父组件中： 

<child ref="child"></child>


this.$refs.child.callMethod()

在调用子组件的时候，声明子组件的名字，  ref=“xxx”

然后就可以在方法中  ，this.$refs.子组件名.子组件方法(参数);

 

另一种方法： 

父： 

 this.$refs.子名.$emit('子的监听中的方法名',参数);

子中： 

methods:{
    monitoring() { // 监听事件
      this.$on('childMethod', (res) => {
          console.log('方法1:触发监听事件监听成功'+res)
      })
   },
}

 

子组件如何调用父组件的方法：

第一种方法是直接在子组件中通过this.$parent.event来调用父组件的方法

this.$parent.父组件方法名();

第二种方法， 使用自定义事件进行调用；

第三种方法： 

将父中的方法  作为popes   传到子组件， 然后在子组件直接调用；

父    将add2 方法传入 ： <text1 ref="mychild" :add2="add2" :msg=1></text1>

子    

props: {
    msg:{type: Number},
    add2:{type: Function}
  },

// 这么调用这个方法
this.add2();