子父传值 this.$emit

子组件向父组件传递数据

子组件 使用 this.$emit(自定义事件类型，传递的数据)
父组件 在子组件标签@事件类型名字='处理函数名称'

子组件:

1. 需要做一个事件触发
2. 发出一个事件(给父组件使用的事件类型)
   1. 使用this.$emit发出事件并传递数据
   2. 通过this发出的事件 只能有父组件监听(兄弟不行)
   3. this是当前的组件实例

语法：

this.$emit(自定义事件类型，传递的数据)

示例:

<button @click="tell">告诉我爸爸 我女朋友名字</button>

methods: {
  tell() {
    this.$emit("getname", this.mygfname);
  },
}

父组件:

1. 监听子组件发出的事件 (在子组件位置) 要有使用关系
2. 触发这个事件类型 调用自己处理函数进行处理@事件类型名字='处理函数名称'
3. 处理函数的参数 就是子组件所传递的数据

语法:

<子组件  @事件类型名字="处理函数"></子组件>

示例

<son  @getname="getName"></son>

methods: {
  getName(data) {
    //事件处理
  },
},

注意：

1. 子组件发出的自定义事件的名称可以与内置事件同名，父组件监听到的事件优先为子组件所发出的自定义事件
2. 没有使用关系 不可以使用这种方式