【VUE框架】组件传值

父组件给子组件传值

1.父组件调用子组件的时候 绑定动态属性
调用子组件然后绑定父组件的数据

 <v-header :homeData='msg'></v-header>

2、在子组件里面通过 props接收父组件传过来的数据

   props:['homeData']

父组件主动获取子组件的数据和方法

1.调用子组件的时候定义一个ref

<v-header ref="header"></v-header>

2.在父组件里通过this.$ref操作
子组件数据

父组件调用

 this.$refs.header.msg
 this.$refs.header.getHomeThis()

子组件主动获取父组件的数据和方法

this.$parent.data
this.$parent.run()

非父子组件传值

创建一个广播对象的JS，如下

import Vue from 'vue';
var vueEvent=new Vue;
export default vueEvent;

在组件1引入JS，并且给组件B广播数据

引入：import vueEvent from '../model/vueEvent.js'
广播：emitFooter(){
           vueEvent.$emit("headerData",this.msg)
       }

在组件2引入JS，并且接收组件1传过来的数据

	var that=this;
       vueEvent.$on('headerData',function(params){
           that.getHeaderData=params
       })