通过Vue 的实例来实现父子组件之间的通信

具体步骤：

  1、先定义一个js连接器

/**
 * Created by Administrator on 2018\8\9 0009.
 * 该文件是为了配合子组件传递数据给父组件(ChildTheParent_17.vue)而创建的,创建一个连接器作为桥梁，实现子组件传递数据给父组件
 */
import Vue from 'vue'
let connector = new Vue();
 
export default connector;

 
          2、父组件实时监听子组件传递过来的数据

<template>
  <div>
    ============================17、 子组件给父组件传递数据============================
    <div>
      <!--
      方式一：
      通过自定义连接器+$emit()+$on()实现
      如果想实现子组件传递数据给父组件，那么就需要一个连接器作为桥梁来实现子组件传递数据给父组件
      当前vue文件为父组件
      1、引入子组件（可以通过局部引入，也可以通过全局引入）
      2、首先父组件需要实时的监听子组件是否有传输数据
      3、子组件通过连接器发送数据给父组件
      4、父组件处理子组件发送过来的数据
      <!--
      1、 1、引入子组件（可以通过局部引入，也可以通过全局引入）
      -->
      <button @click="startListener">实时监听子组件发送过来的数据</button><br/>
 
      <child></child>
 
    </div>
 
  </div>
</template>
 
<script>
import conn