vue 中子组件跟父组件通信需要使用 this.$emit (), 我们先来回顾一下，父组件和子组件的通讯使用什么呢？#
1.父组件向子组件传值：通过v-bind:的形式进行数据的传递(可直接简写为冒号) 然后子组件 使用props来接收
如:
// 父组件
<todo-item v-bind:item="item"
v-bind:index="index"
v-for="(item,index) in list"></todo-item>
// 子组件
var TodoItemValue = {
props: ['item','index'],// 'item','index'就是父组件通过v-bind向子组件传递的
template:"<li>{{item}}{{index}}</li>"
}
2.子组件向父组件传值呢？ 这个时候就需要用到this.$emit()方法了
子组件向父组件传值，基本流程如下:#
第一步：在父组件中引入子组件#
- 使用 import 引入组件
import indexImportOrder from './components/indexImportOrder'
- 声明
//定义组件
components:{
indexImportOrder,
},
- 使用
<indexImportOrder ref="indexImportOrder"/>
第二步 子组件向父组件传值#
- 在子组件中需要向父组件传值处使用 this.$emit (“function”,param);
其中function为父组件定义函数，param为需要传递参数
//新订单页面跳转
viewBusiness(){
let flag = false;
this.$emit('closeMain',flag);
},
- 在父组件中子组件引用处添加函数 v-on=“function1”；
其中function为子组件中定义函数，function1为父组件定义函数--用于接收子组件传值并进行相应数据处理，可定义为同一名称
v-on： 可用 @ 代替 @function=“function1” ，@ 为 v-on：的简写
<indexImportOrder ref="indexImportOrder" v-on:closeMain="closeMain"/>
- val 及为子组件中 flag，即接收的子组件参数
closeMain(val){
this.flag = val;
},