redux是什么?
redux是一種處理應用程序數據的方式。redux要求應用中只有一份數據state,state放在一個叫store的對象中,所有對數據的操作都要通過store來執行。react有三大原則:
1.單一數據源:整個應用的state被儲存在一棵object tree中,並且這個object tree只存在於唯一一個store中。
2.state是只讀的:唯一改變state的方法是觸發action,action是一個描述已發生事件的普通對象。
3.使用純函數來執行修改:為了描述action如何改變object tree,需要編寫純函數reducers。
react和redux是什么關系?
react和redux沒有任何直接的關系,redux只是處理數據的方式,可以使用在react中也可以使用在其它任何地方。
與react配合使用時可以使用react-redux庫提供的方法來提高效率。
為什么要使用react-redux?
react提供了很好的視圖層的解決方案,但在數據的處理方式是沒有提供有效的辦法。使用react-redux可以采用redux思想在react應用中管理數據,同一根組件下的所有組件共享一份數據,
數據放在本組件樹中唯一一個store對象中,所有對數據的操作都要通過store執行,通過使用connect創建的容器組件有了監聽state變化和派發事件修改state的能力。這樣就避免了子組件為了
獲取數據需要數據
層層傳遞的不便。
如何使用react-redux?
react-redux庫的開發思想是使容器組件和展示組件分離。展示組件描述界面如何展現,與redux無關,數據來源是父節點傳入的props,
修改數據通過props調用回調函數,展示組件由自己手
動創建。容器組件描述應用如何運行,使用redux提供的功能,數據來源是redux提供的state,修改數據是
通過redux派發action,容器組件時通過react-redux提供的connect創建。在使用組件
搭建視圖時不需要關心從何處獲取數據,一切數據均通過this.props獲取,所以可以做到組件的復用。視圖搭建完成后使用connect方法創建容器組件來和數據交互,connect接收兩個函數作為參數,
第一個mapStateToProps 定義了如何把stor中的state映射到展示組件的props中,
第二個mapDispatchToProps 方法接收dispatch方法,然后返回期望注入到展示組件props中的回調函數,
在回調函數中可以使用dispatch派發action,從而修改state。connect函數返回一個函數接收一個展示組件作為參數,返回一個容器組件。connect函數內部創建了一個組件並在render方法中渲染
傳入的展示組件,並通過context提供了訪問store的能力,從而可以通過store實現獲取、監聽數據和派發action的能力。store通過redux包提供的createStore方法創建,createStore接收
reducer方法作為參數。reducer由我們自己來定義,reducer是一個存函數,接收state和action兩個參數,功能僅僅是通過action來返回一個新的state,一定要是一個新的state,不允許在原state
上進行修改。redux包還提供了combineReducers方法來合並多個reducer函數返回一個傳入createStore中的reducer,采用多個reducer函數可以分別管理對action的處理,但state有且僅有一份。
最后redux還提供了Provider組件,用於存放store對象,並通過context為子組件提供store對象,store以Provider的屬性方式傳遞進去。
注意事項!!!
state的更新可能是異步的,處於性能考慮react可能會把多個setState調用合並成一個調用。因為this.state和this.props的值可能會異步更新,所以不要依賴它們的值來更新下一個狀態。
所以setState函數也可以傳入一個函數作為參數,傳入函數的第一個參數是上一個狀態的state,第二個參數是本次組件更新時的props。參考:https://react.docschina.org/docs/state-and-lifecycle.html
這里有一個redux的簡單實現https://www.cnblogs.com/ssw-men/p/10870569.html