【Vue.js】组件之间互相调用彼此的方法，子调父，父调子

概述

兄弟组件之间的通讯有一个方法是通过父组件进行交互，那么解决的思路就是子组件调用父组件的方法，然后父组件调用另一个子组件的方法，这样就实现了兄弟组件的交互功能。

父组件调用子组件方法

1. 首先被父组件调用的子组件方法定义一下

   appendToTree({param}){
      console.log('这是子组件tree的方法')
   },

    

2. 父组件parent.vue中的子组件加一个ref属性，就相当于给这个子组件取了一个别名。注意，这个是加在需要调用的子组件上的

   <treeModel ref="tree"></treeModel>

    

子组件调用父组件方法

1. 在子组件上添加一个事件（或者别名？对前端的专业术语不了解），名字随便取，值是准备调用的父组件方法

   <child @parentFn="childTreeFn"></child >

    

2. 在子组件中通过$.emit方法来调用父组件的方法

   //子组件的方法名，随便取
   submit() {
       //因为要调用的是事件为parentFn，后面跟上参数
       this.$emit('parentFn',{param:this.argument});
   },