vuejs父子组件通信多种情况

一：父组件主动向子组件传值

（1）在调用子组件的地方绑定动态数据（也可以传递付父组件方法给子组件，方式一样）

<v-childcomp :parentMsg="parentMsg"></v-childcomp>

（2）子组件通过props接受父组件穿的值

props:['parentMsg']

效果图：

 

二：父组件主动获取子组件的值

（1）调用子组件时候定义一个ref

（2）在父组件里用过调用子组件属性方法：

this.$refs.msg.属性
this.$refs.msg.方法

效果：

三：子组件主动获取父组件的数据

（1）this.$parent.属性

      this.$parent.方法

效果：

 

四：子组件主动传值给父组件

（1）子组件创建一个主动事件通过this.$emit('event',data)传出值

（2）父组件注册绑定自定义监听事件

效果图：

                                                                                                           --------优秀的人都是一点一点积累的。（IT届的吴彦祖）