其實,這是我之前寫過的 一篇文章
[https://blog.hinablue.me/vuejs-watch-cang-zai-yuan-shi-ma-li-de-bian-yuan-ren/](
我絕對不會承認是拿來墊檔的)。雖然我覺得這件事情很奇妙,但是比起 EventBus 的都市傳說,這個應該算還行。只要你看過原始碼應該就能理解。
是說,有誰會沒事去挖人家的原始碼來看( 就你啊 )。
--------------------------------------------------------------------------------
再看一次 $watch
我們平常在操作 $watch 的時候,會有兩種寫法:
export default {
name: 'Component',
data () {
return {
myAge: 18
鐵人賽至今也過半了,所以為了慶祝一下,我們最後來講講各種 Vue App 之間的溝通方法。扣除掉你可能是使用 Webpack 來封裝你的 App
之外,我們也會提及在不同的封裝之間,我們的 App 要如何來進行溝通。
--------------------------------------------------------------------------------
App 與 App
我們之前有提過 new Vue 之間的一些狀況,
> new Vue v.s new Vue Day 7 [https://blog.
這裡拿 :props 來回鍋複習一下,也順帶的,我們會提及一些關於事件溝通的方式。或者說反過來,講事件溝通,然後順帶提一下 :props
也可以。元件溝通其實一直都是各種框架裡面比較麻煩的事情,昨天提到的 Vuex 其實算是偷吃步,元件之間在沒有狀態管理機制的情況下,多數還是仰賴事件傳播為主。
只是,當元件趨於複雜,事件傳播就相對惱人。
--------------------------------------------------------------------------------
props
之前在提及元件的時候有提到這個屬性,如果忘記的人可以再回去看一下:
> Component 基本入門 Day 2 [https://blog.hinablue.me/2019-ithome-ironman-day-2/]
當我們需要將資料傳遞給元件的時候,
我們會把 Vuex
放的比較前面,是因為既然使用了狀態管理機制,那麼,用他來跟各種元件溝通,是比較方便的一件事情。然後,我拖了那麼久才講到元件溝通好像有點奇怪,也是啦,其實我本來就不是很喜歡溝通(欸不對)。
是說,溝通只是 Vuex 附加的好處而已其實。
--------------------------------------------------------------------------------
元件交換資料
我們之前有提過元件之間的資料交換,也提過 Vuex 的基本應用:
* Component 基本入門 Day 2 [https://blog.hinablue.me/2019-ithome-ironman-day-2/]
* Vuex 基本入門
是的,這個篇幅會用來聊一下生命週期當中,比較奇怪的事情。薛丁格
[https://zh.wikipedia.org/wiki/%E8%96%9B%E5%AE%9A%E8%B0%94%E7%8C%AB]
我就不解釋了,程式執行其實並沒有像是量子力學的那種疊加狀態,只是,當 Vue 的元件趨於複雜,再搭配上 Vue Router
的時候,你的某些生命週期中的勾子,就會有你所不知道的狀態。