redux的工作流程


1、redux簡介

redux對於javascript應用而言是一個可預測狀態的容器,即它是一個數據流框架。

redux主要用作應用狀態的管理,即redux用一個單獨的常量狀態樹(對象)保持這一整個應用的狀態,這個對象不能直接被改變。如果一些數據變化了,一個新的對象就會被創建(使用action和reducers)

設計和使用的三大原則:

  • state以單一對象存儲在store對象中
  • state只讀
  • 使用純函數reducer執行state更新

Redux工作流程:

      

 

 

 

 

 

      

      

      

 

 

 

Redux核心API:

    

 

    

 Redux核心API-reducer:

reducer負責處理state狀態,是一個純函數,即只要是同樣的輸入,必定得到同樣的輸出。

純函數的約束條件:

  • 不得改寫參數(形參)
  • 不能調用系統I/O的API
  • 不能調用Date.now()或Math.random()等不純的方法,每次結果會不一致

 

     

 

     

    

 

2、middleware的由來

 在redux里,action僅僅是攜帶了數據的普通js對象。action creator 返回的值是這個action類型的對象,然后通過store.dispatch()進行分發。

比如:我希望實現點擊一個按鈕,2S后更新視圖,顯示消息“HI”,這個時候就需要在action和reducer中間建起一座橋梁來處理異步,這就是middleware.

 

 

3、數據流與react的關系

數據流:數據流是我們的行為與響應的抽象,使用數據流幫助我們明確了行為對應的響應。

react:純V層框架,需要數據流進行支撐

 

4、react-redux

 項目結構:actions、componets、container、reducer

 

涉及到的相關學習網址:

https://github.com/arcthur/react-book-examples

https://redux.js.org/

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM