redux-thunk

一、redux-thunkとは何ですか?
非同期呼び出しがいつ先端に戻るかは制御できないことを知っています.reduxという厳密なデータフローに対して、どうやって非同期を達成することができますか?redux-thunkの基本的な考え方は、関数によって非同期要求をパッケージ化することであり、すなわち、actionCreatorに関数を返し、この関数で非同期呼出を行うことである.reduxの中間部品はdispatch関数の伝達だけに注目しています.そしてreduxもdispatch関数の戻り値に関心がないので、reduxにこの関数を認識させるだけでいいです.
二、redux-thunkソースコードの解読

function createThunkMiddleware(extraArgument) {
  return ({ dispatch, getState }) => next => action => {
    if (typeof action === 'function') {
      return action(dispatch, getState, extraArgument);
    }
    return next(action);
  };
}
const thunk = createThunkMiddleware();
thunk.withExtraArgument = createThunkMiddleware;
export default thunk;

ちょっと見たところ、これはmiddlewareではないですか?そうです.redux-thunkはmiddlewareです.唯一のポイントはactionに対して以下のような判断をしました.

if (typeof action === 'function') {
  return action(dispatch, getState, extraArgument);
}

つまり、actionCreatorからのactionが関数であることがわかったら、この関数を実行して、この関数の戻り値を返します.前にも述べましたが、reduxはdispatch関数の戻り値にあまり関心がないので、ここは大丈夫です.
このようにすれば、私たちのactionCreatorでは、任意の非同期呼出しができます.そして、いかなる値を返しても構いません.だから私たちはこのようにプロモーションを呼び出すことができます.

function actionCreate() {
  //        
  return function (dispatch, getState) {
    //            。。。
    fetch({xxx}).then(function (json) {
      dispatch(json);
    })
  }
}

redux-thunkを通じて,非同期の動作を既存のデータストリームに融合させた.
最後にもう一つ注意したいのですが、中間部品はdispatchの伝達だけに関心がありますので、他のことを制限しません.そのために、中間部品リストのトップ(つまりcomposeパラメータの中の一番目、最後にdispatchを処理します.)にredux-thunkを入れて、彼の中間部品の中で非同期要求に戻らないようにします.