關於react中redux的理解

redux是react的狀態管理工具，在redux中，將所有的狀態統一集中到唯一的stoer中管理，在store中只能通過自己定義的方法來修改狀態，優點是可以**到狀態的變化，執行相應的修改方法，提高可維護性和可讀性，易於狀態監聽。

redux的使用方法

redux用來建立reducer store action等

react-redux用來對映倉庫的狀態和分發reducer--分發修改狀態的方法

redux-thunk用來處理非同步函式，如發請求非同步，處理非同步任務等、

專案中使用redux的五個步驟

建立倉庫物件並匯出倉庫物件 store.js

第乙個方法用來建立倉庫，第二用來處理非同步請求

使用建立倉庫物件並匯出

2.建立reducer.js用來定義狀態資料，使用函式定義，第乙個引數是state 預設值，第二個引數是action是乙個物件，可以使用action的type屬性用來定義修改狀態的行為

用來處理修改合併

將所用狀態合併一起匯出

3.建立action.js，用來定義倉庫的修改行為，修改store狀態，action實質是乙個物件，修改的方法都是通過action，並提交action進行修改其中type表示修改型別，也可以新增其他屬性定義作為操作修改狀態的引數。

修改方法的定義，其中content的值可以作為修改狀態時的返回值。

多個修改方法的匯出用export

4.在index.js中，全域性注入倉庫物件並使用並修改初始的渲染元件

匯入provider元件，其中元件的store屬性，作為倉庫屬性應用在各個元件中。

第一種對映

在元件中使用狀態，home.js 在其中匯入對映檔案

![在這裡插入描述](

conect用來對映倉庫狀態，action用來修改倉庫狀態

改造匯出的home元件

connect是乙個函式，第乙個引數是函式，返回值為狀態資料，第二個引數是函式，返回值是修改狀態的方法，connect函式的引數是元件物件 dispatch用來提交action函式

在使用修改狀態的方法時應該用this.props來呼叫方法

第二種對映將connect分開定義，並匯出元件

第三非同步獲取資料和修改狀態

非同步獲取資料不作為狀態，就直接在檔案返回資料

如果需要修改狀態，要派發相應的方法並傳入相應引數、

redux總結如下

redux核心概念為 store action reducer

store是唯一的資料來源，所有資料以乙個樹的形式存在於store中

action是更新資料的行為每乙個action都是乙個物件物件中有乙個名為type的字段（type的值一般是乙個大寫形式的唯一的字串）用於表示當前的行為型別；還可以帶有其它字段用來更新store（一般我們將額外的資料統一放到名為payload的字段中）。

reducer是乙個js方法，這個方法接收兩個引數：state和action。其中state表示資料，action就是上面提到的乙個物件。每當有乙個action被觸發，所有的reducer方法都將被執行。

在reducer的方法中，如果接收到的action的type是存在的，那麼就可以根據state和action來生成乙個新的state，否則直接返回state。一般情況下reducer方法中都會有乙個switch，通過switch來根據接收的action.type來執行不同的更新操作。