父子
- 父子通信(回調(diào)函數(shù))[組件通信]
父傳子:父組件傳一個函數(shù)給子組件,子組件在恰當(dāng)?shù)臅r候調(diào)用
子傳父:1.父組件將一個函數(shù) fn 作為子組件的 props 傳給子組件
2.子組件在恰當(dāng)?shù)臅r候調(diào)用這個 fn厦酬,并且把數(shù)據(jù)放在 fn 的參數(shù)里
如龜兔賽跑的例子
- 問爺孫組件如何通信?
爺爺傳給爸爸,爸爸再傳給孫子
eventHub發(fā)布訂閱模式
首先建立一個管家,然后需要操作就通知管家,管家操作完后發(fā)給App,App再逐一發(fā)給下面的人
花錢的例子
Redux
Redux特點:
- 所有的動作通過事件來溝通
- 所有數(shù)據(jù)放在頂層
Redux缺點:
- 將事件名和參數(shù)做了約束,每個事件都必須有事件名和參數(shù),所有事件都要列入列表內(nèi),否則不接受
- 不能用State,只有以props的形
式去用State
Redux優(yōu)點:
- 把event歸類,不能瞎命名
- 要求所有數(shù)據(jù)是只讀,任何組件不能修改根級數(shù)據(jù),但是沒法禁止
- 制造一些概念讓不好好學(xué)的人滾蛋
簡述 React 任意組件之間如何通信仗阅。
- 如果只是父子級關(guān)系国夜,父級可以將一個回調(diào)函數(shù)當(dāng)作屬性傳遞給子級,子級可以直接調(diào)用函數(shù)從而和父級通信车吹。
- 使用eventHub觀察訂閱模式:就是建立一個管家,然后需要操作就通知管家,管家操作完后發(fā)給App,App再逐一發(fā)給下面的人
- 使用redux組件通過dispatch發(fā)出action,store根據(jù)action的type屬性調(diào)用對應(yīng)的reducer并傳入state和這個action朝卒,reducer對state進行處理并返回一個新的state放入store乐埠,connect監(jiān)聽到store發(fā)生變化,調(diào)用setState更新組件瑞眼,此時組件的props也就跟著變化棵逊。