vue子组件向父组件传值----$emit

子组件向父组件传值可以使用  $emit()  

我的理解是子组件通过$emit方法把自己的第一个参数eventName传递给父级，父级把eventName当成一个事件，触发这个事件接收子级传给自己的数据或执行操作

$emit ( eventName,args..)

参数eventName(必传参数): 传递到父级的时间名

参数args(可选参数): 传递到父级数据（可以传字符串、数组、对象、函数，我感觉啥都能传）

注：1.args是一个参数列表，可以传好多参数；

   2.一个子组件可以用多个$emit 

例一是不传args的情况，例二是传多个args的情况

例1:

子级代码 （child.vue）

<!-- 子组件 -->
<template>
	<div id="child" @click="$emit(sendparent)"></div>
</template>

<script>
    export default {
	name: 'menuLeft',
	data (){
		return {
			
		}
	},
	methods: {
		
	},

}
</script>

父级代码 （parent.vue）

<!-- 父组件 -->
<template>
  <div id="parent">
    <menu-left @sendparent="helloFn"></menu-left>
  </div>
</template>

<script>
export default {
  name: 'App',
  methods: {
    helloFn: function () {
      alert("hello world");
    },
  },
  created() {

  }
}
</script>

例2:

<!-- 子组件 -->
<template>
	<div id="child" @click="$emit(sendparent,'hello',function(){return 'world'})"></div>
</template>

<script>
    export default {
	name: 'menuLeft',
	data (){
		return {
			
		}
	},
	methods: {
		
	},

}
</script>

<!-- 父组件 -->
<template>
  <div id="parent">
    <menu-left @sendparent="helloFn"></menu-left>
  </div>
</template>

<script>
export default {
  name: 'App',
  methods: {
    helloFn: function (param1,param2) {
      alert("hello world");
      alert(param2());
    },
  },
  created() {

  }
}
</script>

如果想在方法中调用$emit的话，写成this.$emit()就OK了

差不多就这样了，有问题在补充～～～～～