について


私は前にreduxを使用したことがない.今日はReduxコアを試してみました.それはなぜ動作しませんでしたか?

まず、なぜ我々はReduxを使用しますか?
状態を管理すると、RedUxは変更を購読するような機能を持たなければなりません.
Reduxコアはこのようなことをしていますか?答えはNOです.そういうわけで、彼らは反応Reduxをつくりました.

還元関数
単に通常のオブジェクトである前の状態とアクションを取りますが、通常は2つのフィールド:type(String)とpayload(任意)を持つオブジェクトとして構成します.もちろん、どんな型でも使えますが、推奨されません.

どのようにReduxは国家を開始?
最初のredux状態への2つの方法があります.
第一の道はpreloadedState to createStore 関数.この方法について言う何も.
第2の方法は、還元器のデフォルト引数を渡すことですstate , 好きなものconst reducer = (state = defaultState, action) => ... .
ドックへのArcorrdingは、Reduxはdefault-state , その行動はdefault 我々が使用した場合switch を指定する).
createStore(combineReducers({
    test1: (state = 'YESY', action: any) => { console.log('test1', state, action); return state; },
    test2: (state = 'YESY2', action: any) => { console.log('test2' ,state, action); return state; },
  })
あなたは{ test 1 :' yesy 'のストアを取得します.
初期状態は常にstate ? reduxは、デフォルトの状態を取得するためにいくつかのダミーアクションを送信するので、それは私たちの減速器を実行し、デフォルト値として戻り値を扱います.
試してください
createStore(combineReducers({
    test1: (state = 'YESY', action: any) => { console.log('test1', state, action); return 'NOT_A_DEFAULT_VAL'; },
    test2: (state = 'YESY2', action: any) => { console.log('test2' ,state, action); return state; },
  })
あなたは{ test 1 :' nnotdefaultchen val ', test 2 :' yesy 2 '}のストアを取得します.

我々は、減速を実行するアクションを派遣?
Reduxはすべての還元器にアクションを渡します.もし還元器が動作を期待しているなら、それは新しい状態を返します.さもなければ、以前の状態を返します(参照を維持しました)(これはあなたの実装に依存します、それは前の状態か何か他のものを返すかもしれません).だから私たちは約10000の減速剤を持っているかどうかを推測:Dは、我々のアプリはとても遅くなるようになります.

AppleMiddlewareは何をしますか?
iveは非常に最初の時、ドキュメントを読んで混乱を感じた、それはディスパッチを取る、新しい派遣を返すと、私はそれがどのようにドキュメントから動作するかを把握するので、ソースコードを読むことを選択:D
applyMiddleware 新しいディスパッチ機能を作成しますstore . 発信は呼び出しによって生成されるcompose(...chain)(store.dispatch) chain は、context , context を含むgetState, and the default dispatcher , それは、マップされていないことに注意してくださいので、すべてのコンテキストは、ミドルウェアに渡されている同じミドルウェアAppleMiddlewareに渡されるミドルウェア左から右に呼ばれるて
続けて、チェーンが一緒に構成されますが、何がcompose ?compose 関数のリストを取り出し、関数を呼び出したときに1つのパラメータだけを取る関数tを返します.最初に、関数の最後の関数を呼び出します.返り値を取得し、その値を持つlast - 1関数を最初のパラメータに呼び出します.右を混同してください.compose(fn1, fn2, fn3)(input) => fn1(fn2(fn3(input)) , ApplicIddlewareによって返されるディスパッチャは右から左へ呼ばれます.それは、チェーンが何であるかを意味します、最初のミドルウェアは最初の行動をとるでしょう、最終的な行動は最初のミドルウェアのディスパッチャが返すものに依存します、通常、我々は次のディスパッチャを呼び出して、(変更された)行動を取り戻して、返された行動でものをします.
に戻るapplyMiddleware , 新しいディスパッチャは呼び出しによって作成されるcompose with chain , デフォルトディスパッチャでパスし、デフォルトのディスカバリーと新しいディストリビューターが同じタイプであることに注意してくださいchain ディスパッチャを受け取り、ディスパッチャを返す関数のリストでなければなりませんcompose 作品
我々はパラメータの簡素化することができますapplyMiddleware 以下のように:
({ dispatch: defaultDispatch, getState }) => lastDispatch => newDispatch
我々が通過した最後のミドルウェアの最後の派遣は何ですか?それは単に私が取るものを返す関数です.lastDispatch = (action) => action .
つのミドルウェアがListMiddlewareと呼ぶならば、どうですか?チェーンはそのミドルウェアで停止します.その後のミドルウェアはコールされません.
ディスパッチャができる唯一のことはaction それに渡されますが、どのように我々は修正されたアクションをアーカイブ?それは私が質問した質問です、答えは修正版を返しています、それで、それを呼び出したディストラクターは修正された行動を取り戻すことができます.我々が我々のミドルウェアのディストラッカーでやりたいことは何でも、より良い行動を返します