最近開(kāi)始在學(xué)習(xí)vue的相關(guān)知識(shí)漠其，簡(jiǎn)單記錄下學(xué)習(xí)過(guò)程中的一些理解。
在看到組件這塊有個(gè)父子組件傳值的內(nèi)容：
1.父組件可以使用 props 把數(shù)據(jù)傳給子組件园骆。
2.子組件可以使用 $emit 觸發(fā)父組件的自定義事件。
沒(méi)錯(cuò)，那么到底是如何通信呢朵夏，又是怎么界定父子組件的呢？
我們看下面的例子：
圖1
圖2
點(diǎn)擊圖1例子中的button："點(diǎn)擊此處將‘大連’發(fā)射給父組件",會(huì)去調(diào)用方法select,在select中我們會(huì)通過(guò)觸發(fā)this.$emit調(diào)用父組件的showCityName這個(gè)事件榆纽，接著在圖2中的showCityName又會(huì)去調(diào)用updateCity方法仰猖，方法中通過(guò)子組件的this.$emit的參數(shù)?data?將自己的toCity參數(shù)值改成了子組件傳遞過(guò)來(lái)的值询吴。至此，子傳父的結(jié)束亮元！
那上面提到父組件可以使用 props 把數(shù)據(jù)傳給子組件猛计，此時(shí)的父組件中的senddata變成了‘大連’，那子組件中將會(huì)展示成：
父組件傳給子組件的toCity:大連
界定父子組件爆捞？看過(guò)上面的例子其實(shí)已經(jīng)很清楚了奉瘤，父組件中的components{TrainCity}?已經(jīng)明確的告訴了我們他的子組件就是TrainCity ，而TrainCity就是import TrainCity from "./train-city"
圖1中的組件name:train-city煮甥，子父組件的關(guān)系也就清楚了盗温。
在貼一個(gè)例子：
圖3
如圖，這代碼里面誰(shuí)是父組件成肘，誰(shuí)是子組件卖局？
很簡(jiǎn)單可以這么理解：父組件是已被掛載的vue實(shí)例，而子組件双霍，是被這個(gè)實(shí)例調(diào)用的自定義組件本身砚偶，而不僅僅是自定義標(biāo)簽或自定義組件中的模版標(biāo)簽。在這個(gè)例子中洒闸，父組件是var app1=new Vue({el: '#emitText'})染坯， 而子組件是自定義的組件整體也就是components?里面的內(nèi)容，它其實(shí)就是最外層div里面的內(nèi)容丘逸。
記錄學(xué)習(xí)的過(guò)程单鹿，寫下自己的理解！
可能每個(gè)人的理解都不同深纲，以后如果能看到更好的解釋仲锄，也會(huì)記錄下來(lái)。
