學習react基礎知識（四)

 

全局狀態管理

Vue全局狀態管理 vuex

state mutation action getter module 輔助函數

redux

多組件共享狀態，一個組件發生改變其餘的都要變

在電視上劇裏活不過3集 甄嬛傳 慈禧太后 -> 光緒帝 -> 賣地求榮 ->閉關鎖國 -> 垂簾聽政

安裝redux

npm install redux

角色劃分

皇帝 store 傳遞奏摺 發佈政令老佛爺 reducer 接受奏摺 根據局奏摺批閱平民百姓 component 使用數據 修改數據文武百官 actionCreator 提交奏摺給老佛爺

多組件共享狀態

1.建立小皇帝 store 而且和老佛爺關聯2.建立老佛爺 3.在組件中使用 a.引入小皇帝 b.使用小皇帝下的getState方法，getState方法獲取的值就是老佛爺返回的值

一個組價組件改變其餘組件都要變

1. 建立actioncreatore 本質是一個對象 對象裏有一堆的函數在內部的函數 a. 建立action 也是一個對象必須有type b. store.dispatch(action) 提交action給老佛爺

2. 老佛爺根據參數裏修改前的數據和action 對數據進行修改 而且返回修改後的數據

3. 數據更改了可是頁面不會發生改變 經過 store.subscribe(()=>{ this.setState({}) 更新界面})監聽全局狀態值發改變

redux 模塊化

redux 異步處理

同vuex中同樣 能夠將網絡請求放到actionCreatore

1. 減小重複的代碼 統一管理api接口

2. 時間旅行 更精準的檢測到全局狀態值的變化

樣式做用域的問題

在react中樣式沒有做用域 ，當不一樣組件類名重複又的時候 致使樣式覆蓋