VUE中父组件、子组件之间的双向通讯可以参见笔者的《vue页面和component组件之间双向通讯》。

第一种通讯方式【参数传递】

上文中双向通讯的方式可以总结为：

1、父组件向子组件传递参数

第一步、父组件将需要传递的数据放置到调用子组件的参数变量中
<子组件名   参数名="参数变量"  .....    />

第二步、子组件通过props接受父组件通过参数变量传递来的数据
props: {
    参数变量1: {
      type: String, 
     defult: ''
    },

第三步、子组件在watch中监控参数变量1，一旦有变化则进行相关逻辑处理
   参数变量1(val){
         .。。。。。。。。
    };

2、子组件向父组件传递参数

第一步、子组件通过如下命令将参数值传递给父组件
this.$emit('paramchanged', 参数值);

第二步、父组件通过如下方式获取到子组件传递过来的参数值（存放在参数变量中）
<子组件名  v-bind:参数名="参数变量" v-on:paramchanged="参数变量 = $event"  .....    />

第三步、父组件在watch中监控参数变量，一旦有变化则进行相关逻辑处理

   参数变量(val){

         .。。。。。。。。

    };

以上通讯方式的优点（同时也是缺点）是参数必须有变化，传递过来后来才能触发watch。

第二种通讯方式【互调方法】

1、在父组件中调用子组件中的方法

第一步，父组件中给子组件命名（如为childname）
<子组件名   ref="childname"  .....    />

第二步，父组件中可以直接调用子组件中的方法
  this.$refs.sub_child.addReport(1);    //addReport(1)是子组件methods区域的一个方法。

2、在子组件中调用父组件中的方法

在子组件中执行如下命令：
this.$parent.$parent.$parent.$parent.$parent.方法名(参数清单) ；
方法名是父组件methods中的任意一个方法。
特别注意：以上是通过$parent访问父组件，具体需要多少个$parent，需要在开发的时候确定。