在Vue中組件實(shí)例之間的作用域是孤立的，以為不能直接在子組件上引用父組件的數(shù)據(jù)，同時(shí)父組件也不能直接使用子組件的數(shù)據(jù)
情景1，父組件中調(diào)用子組件的方法并向子組件傳參——ref
聲明下面說的是vue 2.0的
1、當(dāng)ref直接定義在dom元素上時(shí)，則通過this.$refs.name可以獲取到dom對(duì)dom進(jìn)行原生的操作
//父組件
<component-son ref="firstson"></component-son>
//子組件component-son內(nèi)定義一個(gè)方法供父組件調(diào)用，例如 init
init: function(value) {
//在這里獲取到父組件傳過來的參數(shù)
},
通過this.$refs獲取到dom進(jìn)行操作（注意ref屬性的命名不能用駝峰，同時(shí)獲取的時(shí)候也是）
父組件中調(diào)用子組件的方法并向子組件傳參
this.$refs.firstson.init(a);
//子組件的init方法會(huì)調(diào)用一次并傳遞參數(shù)a
情景2，子組件觸發(fā)父組件的方法并傳遞參數(shù)——emit
子組件通過this.$emit()派發(fā)事件，父組件利用v-on對(duì)事件進(jìn)行監(jiān)聽，實(shí)現(xiàn)參數(shù)的傳遞
//父組件 ? 自定義事件 hello
<component-son @hello="fatherevent"></component-son>
//子組件
this.$emit('hello',{});
//向父組件派發(fā)事件，同時(shí)傳遞參數(shù){},后面的參數(shù)的個(gè)數(shù)不限
//父組件的fatherevent方法將會(huì)執(zhí)行
情景3，父組件向子組件動(dòng)態(tài)傳值——props
//父組件
<component-son ??:messageProp="sendProp"></component-son>
data{
sendProp:'',
}
//子組件
props: {
messageProp: String,
},
父組件的參數(shù)sendProp改變，子組件的參數(shù)? this.messageProp同時(shí)改變
注意：
1、傳遞參數(shù)時(shí)要用—代替駝峰命名，HTML不區(qū)分大小寫
2、sendProp要在父組件的data中定義，例如 sendProp:''
3、messageProp在子組件的props中聲明類型，例如 messageProp: String
4、在利用props實(shí)現(xiàn)傳值的過程中理論上是要實(shí)現(xiàn)單向傳遞，即父組件改變相關(guān)參數(shù)的值，子組件也相應(yīng)變化，但是子組件對(duì)參數(shù)的改變不應(yīng)該影響父組件。但是當(dāng)props中接收的是父組件傳遞的引用類型（對(duì)象或者是數(shù)組）時(shí)，在子組件中對(duì)數(shù)據(jù)改變時(shí)，父組件中的數(shù)據(jù)也會(huì)相應(yīng)的改變，因?yàn)閮烧呤侵赶虻耐坏刂穬?nèi)存。如果不想子組件的改變影響父組件可以利用深拷貝，將接受的數(shù)據(jù)進(jìn)行深拷貝后在子組件中使用，而不直接操作接受的數(shù)據(jù)。
如果幫到了你，請(qǐng)點(diǎn)贊！
