1.父组件给子组件传值：
父组件(v-bind传值）
<div :msg="msg"></div>
子组件(default是为了避免父组件没有传值的情况）
export default{props:{msg:{type:String,default:'hello world'}}}
2.子组件给父组件传值：
this.$emit('方法名称', this.message);
3.兄弟组件传值：
1、兄弟之间传递数据需要借助于事件车，通过事件车的方式传递数据
2、创建一个Vue的实例，让各个兄弟共用同一个事件机制。
3、传递数据方，通过一个事件触发bus. bus.$emit('方法名称'，'传递的值')
4.接受数据放bus.$on(方法名，function(接收数据的参数){用该组件的数据接收传递过来的数据})，此时函数中的this已经发生了改变，可以使用箭头函数。
1.创建一个单独的bus.js
import Vue from 'vue'
export default new Vue
2.兄弟组件分别引入bus.js ：import bus from '../../js/event.js'
3.传递数据的组件： bus.$emit('myFun'，'传递的值')
4.接收数据的组件：bus.$on('myFun',(message)=>{//这里最好用箭头函数，不然this指向有问题
this.msg = message})
4.顺便说下ref吧
1.ref可以获取到dom元素(<div ref='textDiv'></div> ,this.$refs.testDiv)，也可以获取子组件中的data和去调用子组件中的方法;
子组件：
<template><div></div></template>
<script>export default { data:{msg:'子组件的data'},
methods: {
open() { console.log("子组件方法执行") }
openPar(){ console.log('调用父组件的方法');this.$emit("parentF");}
}}</script>
父组件：获取子组件的data和方法(open);
<template>
<divid="app">
<HelloWorld ref="hello" @parentF='getData'/>
<button @click="getHello">获取helloworld组件中的值</button>
</div></template>
<script>
import 引入子组件;
export default {
components: { HelloWorld }, data() { return {} },
methods: {
getHello() {
console.log(this.$refs.hello.msg);//获取数据
this.$refs.hello.open()；//调用子组件的方法
this.$refs.hello.openPar()；//调用父组件的方法
} }
getData(){
console.log('aldkjl')
}
};
子组件调用父组件的方法：openPar(){ console.log('调用父组件的方法');this.$emit("parentF");}
</script>
