React - ReduxはUI状態に基づいてアクションをディスパッチします

Question

私のリアクションコンポーネントレデューサー状態では、selectedTabIndexプロパティがあり、現在どのタブがUIでアクティブであるかを指定します。

const deviceRankReducer = (state = { 
    selectedIndex:1 
},action) ={ 
    //... 
} 

私のReduxアクションでは、選択したタブインデックスに基づいてAJAXコールを作成したいと考えています。

class MyActions extends ReduxActionsBase { 
    sendRequest(){ 
      if(state.selectedIndex === 0){ 
      //make call to resource A 
      }else{ 
      //make call to resource B 
      } 
    } 
} 

アンチパターン決定を行わずにReduxActionsBaseと情報を共有するベストプラクティスは何ですか？

Answer 1

redux-thunkを使用することをおすすめします。 redux-thunkを使用すると、条件付きおよび非同期アクションをディスパッチできます。アクション作成者の中でRedux状態にアクセスできます。あなたのケースでのアクションの作成者は、この

function makeRequest() { 
    return (dispatch, getState) => { 
    const { selectedIndex } = getState(); 

    if(state.selectedIndex === 0){ 
     //make call to resource A 
    }else{ 
     //make call to resource B 
    } 
    }; 
}