Redux saga - データがreduxストアに既に存在する場合、API requstsをスキップするポイント

Question

私はredux-sagaの使用法を使用してプロジェクトを進めています。私はGoogleの力で2日間近く質問に答えを見つけようとしましたが、助けにはなりませんでした。

各FETCH_REQUESTアクションで、sagaによってトリガーされる関数があります。

export function* fetchData(action) { 
    try { 
    const usersList = (yield select()).usersList; 

    // makes API call only if there is no users found in the current state 
    if(!usersList) { 
     const data = yield call(Api.fetchUser) 
    } 

    yield put({type: "FETCH_SUCCEEDED", usersList}) 
    } catch (error) { 
    yield put({type: "FETCH_FAILED", error}) 
    } 
} 

成功すると、FETCH_SUCCEEDEDアクションがトリガーされ、受信したデータを状態に保存します。しかし、APIコールを作るかどうかという意思決定ポイントは適切な場所にないと私には思われます。 現在のアプローチでは、サガには役に立たず、スキップされたいくつかのアクションが生成されます。他の人が_REQUESTアクションで購読してしまった場合、別の無駄なアクションなどを引き起こします。

したがって、データがAPIまたはReduxStoreからロードする必要があるかどうかを確認する「ベストプラクティス」は何ですか？

Answer 1

あなたのコンポーネントからアクション作成者FETCH_REQUESTを発送することを前提としています。このコンポーネントはおそらくプロパティとしてuserListを受け取ります。したがって、このコンポーネントは、FETCH_REQUESTアクションをディスパッチする必要があるかどうかを判断するのに最適な場所です。このような

何か：

class MyComponent extends React.Component { 
    componentDidMount() { 
    if (!this.props.userList) { 
     this.props.fetchData(); 
    } 
    } 
} 

... 

export default connect(mapStateToProps, mapDispatchToProps)(MyComponent); 

この場合、あなたは自分の佐賀でセレクタと、余分な条件を使用する必要はありません。