當我們建立了應用程式如todolist。每當action被dispatch時，state會立即更新，這是屬於同步操作。

如果是非同步的應用程式，從外部獲取數據並在應用程序中使用數據,如何讓非同步與 Redux 資料流結合，在使用非同步操作之前，首先需要定義state、action、reducer。今天先介紹在使用非同步操作從外部獲取資料時state、action、reducer將如何定義。

一、定義初始狀態需有三個屬性參數：

const initialState= {
    loading:false,
    user:[],
    error:''
}

第一個參數是loading，它指示當前是否正在獲取數據，
第二個參數是獲取數據本身，用[ ]array表示
第三個參數是錯誤訊息當請求數據時由於某種原因失敗無法取得資料,我們會得一個錯誤訊息,將其存儲在錯誤屬性中。

二、定義Action

針對任何一個 API 請求會需要 dispatch 至少三個不同種類的動作

const fetchUserRequest = () =>{
    return{
        type:FETCH_USERS_REQUEST,
    }
}

const fetchUserSuccess = (users) =>{
    return{
        type:FETCH_USERS_SUCCESS,
        payload:users,
    }
}

const fetchUserFailure = (error) =>{
    return{
        type:FETCH_USERS_FAILURE,
        payload:error,
    }
}

一個告知 reducer請求開始的 action
reducer 可以藉由打開 state 裡的 isFetching flag 來處理這個 action。

一個告知 reducer請求成功完成的 action
reducer 可以藉由把新的資料合併到它們管理的 state 裡，並顯示抓回來的資料。

一個告知 reducer請求失敗的 action,存儲錯誤訊息
Reducers 可以藉由重置 isFetching 屬性來處理這個 action。

最後定義Reducer函數

const reducer = (state = initialState,action)=>{
    switch(action.type){
        case FETCH_USERS_REQUEST:
            return {
                ...state,
                loading:true,
            }
        case FETCH_USERS_SUCCESS:
             return {                
                loading:false,
                users:action.payload,
                error:''
            }
        case FETCH_USERS_FAILURE:
            return {                
               loading:false,
               users:[],
               error:action.payload,
           }
    }
}