ログを実現する - 3、Reduxのソースコード - 変換のディスパッチ

ディスパッチ・エントリ・アクションが配布され、すべてのアクションは、ここからの発送に配布されています。

だからここ発送は重要なノードであり、

派遣サービスからの出発で、それがさらに派遣をカプセル化することができれば、全体は、これにより、再来のディスパッチ機能を実現することができる変更

全体ディスパッチ機能を強化。

 

例:あなたが行動を配布するたびになるようにどのように我々は発送方法を変換しない、私たちはより明確に彼らに状態を変更するすべてのステップを保存理解するためにはconsole.logの関連情報を経由してプリントアウトすることができますか?

発送は基本的にビューの更新を達成するために、各リスナー関数の実装が続く変更の減速を実行する状態に依存する、減速メソッドを呼び出すための責任がある機能です。

このように、私たちの出発点は、ディスパッチ関数呼び出しの前または後にも出力にconsole.log状態を挿入する必要があります。Reduxのデータ更新を考えるための最も簡単な方法は、手動で記録の実施前と後の両方のビジネスコードで同時に毎回store.dispatch(アクション)が行われます。

次のように:

console.log(アクション+ '派遣する' ); 
はconsole.log(store.getState)
store.dispatch(アクション)
はconsole.log(アクション + 'は既に派遣' 
はconsole.log(store.getState())
//ここ問題は、私たちがコードに失礼散乱にconsole.logに参加することができないということである統一発送方法を拡張することによって達成されなければなりません
//ディスパッチ関数を変換するために、我々は次の手順に従います。
1.新しい発送方法の「オリジナルの古典的な派遣」を置き換える生成するために使用されるaddLoggingToDispatchという名前の関数を作成します。
この関数は、元の発送はrawDispatch方法だった傍受して記録するために派遣を格納する必要があります。一方、addLoggingToDispatch
機能が動作中に、元の発送と一致している必要があり、それは、関数の最後に、新しい機能が更新ログの後、新たな派遣を追加することであるという新しい関数を返します。
したがって、この関数は、パラメータとしてアクションの動作を模倣する自然rawDispatchを返します。
addLoggingToDispatch =一定(ストア)=> { 
    constのrawDispatch = store.dispatch;
     // 新しいディスパッチ関数が戻る更新ログを追加することです後
    リターンアクション=> {
         // ... 
    } 
}
rawDispatch周りを呼び出しながら2、関数が戻ると、我々は、元の動作派遣を復元し、実際のrawDispatchメソッドを呼び出す必要があります
ロギング。元派遣の削減行動を最大化するために、記録される戻り値を派遣し、ことに注意してください、そして最終的に戻ります。
CONST addLoggingToDispatch =(店舗)=> { 
    CONST rawDispatch = store.dispatch。
    リターン(アクション)=> { 
        にconsole.log(action.type)。
        console.log( '以前の状態'、store.getState())。
        console.log( 'アクション'、アクション)。
        CONST retureValue = rawDispatch(アクション)
        console.log( '次状態'、store.getState())。
        console.group(action.type)。
        retureValueを返します。
    } 
}

  

3、最終的には開発環境と本番環境を決定するには、我々は願ってのみ可能な開発段階でこれらのログ出力、簡単なチューニング、運用環境での出力に適していません。
したがって、store.dispatch、最初の環境の判断を書き換え前。
もし(!process.env.NODE_ENV == '生産' ){ 
    store.dispatch = addLoggingToDispatch(店舗)。
}

 

おすすめ

転載: www.cnblogs.com/hellolol/p/11305522.html