父子組件相互通信
- 父?jìng)髯? 父組件在調(diào)用的子組件標(biāo)簽上添加額外屬性，如v-bind:message="msg" 將父組件中的msg屬性傳遞給子組件（如果傳遞死數(shù)據(jù)，可以不使用指令）
子組件通過(guò)props來(lái)接受父組件傳遞的數(shù)據(jù)，如props:{'message'}
子組件接收和父組件傳遞名稱(chēng)必須一樣 - 子組件自定義事件，通過(guò)$emit 向父組件傳遞數(shù)據(jù)，如 子組件
onClick(){
this.$emit('showData',{name:'hello'})
}
父組件調(diào)用：
<child @showData = 'show'></child>
methods(){
show(data){
this.name = data.name
}
}
- 父組件訪問(wèn)子組件可以使用$children來(lái)獲取一個(gè)包含所有子組件(vueCommponet)的數(shù)組，可以通過(guò)下標(biāo)
索引來(lái)獲取相對(duì)應(yīng)的子組件的數(shù)據(jù)。
子組件訪問(wèn)父組件可以使用$parent來(lái)獲取父組件的數(shù)據(jù)（不推薦） - 向子組件添加ref屬性，父組件通過(guò)$refs根據(jù)ref屬性值來(lái)定位子組件，從而獲取子組件的數(shù)據(jù)
$refs 只會(huì)在組件渲染完成之后生效，并且它們不是響應(yīng)式的。這僅作為一個(gè)用于直接操作子組件的“逃生艙”——你應(yīng)該避免在模板或計(jì)算屬性中訪問(wèn) $refs。
非父子組件通信
1.通過(guò)父組件進(jìn)行通信
2.通過(guò)建立公共倉(cāng)庫(kù)進(jìn)行通信
在所有組件最上層建立一個(gè)中央事件總線（bus）
import Vue from 'vue'
var PublicEvent = new Vue()
export default PublicEvent
如 從組件1調(diào)用組件2 中的方法和數(shù)據(jù)
在組件1和2中都需要引入中央事件總線PublicEvent
在組件2 中，定義一個(gè)事件，通過(guò)該事件觸發(fā)PublicEvent.$emit('名稱(chēng)'，需要傳遞的值)
在組件1中，通過(guò)鉤子函數(shù)mounted在初始化組件時(shí)調(diào)用PublicEvent.$on('名稱(chēng)'，func)
