1

redux、react-redux、redux-thunk をセットアップしようとしています。おおむねうまくいっていると思いますが、複数の非同期アクションを連鎖させたときにどのように見えるかについて質問があります。

具体的には、アクションを呼び出すことができる別のアクションによって、アクションを個別にまたは間接的に呼び出すことができるシナリオがあります。selectItem私の質問は、慣用的にしたい場合、どのように作成する必要がありますか?

action.js

export function fetchByContext(contextId) { 
    return dispatch => {
        _fetchByContext(messages => { 
            dispatch({ type: RECEIVE_MESSAGES, ... });
        });
    };
};

export function subscribeByContext(contextId) {
    return dispatch => {
        _subscribeByContext(messages => { 
            dispatch({ type: RECEIVE_MESSAGES, ... });
        });
    };
};

export function selectItem(contextId) {
    return dispatch => {
        subscribeByContext(contextId)(dispatch);
        fetchByContext(contextId)(dispatch);
    };
};
4

1 に答える 1

1

キーはそれだと思います（ref）：

内部関数からの戻り値は、ディスパッチ自体の戻り値として使用できます

の内部関数がpromisefetchByContext()をsubscribeByContext()返す場合、これらは直列に連鎖するか、 から並列に実行できますselectItem()。_fetchByContext()promiseも_subscribeByContext()returnもないと仮定した、テストされていない実装は次のようになります。

export function fetchByContext(contextId) { 
    return dispatch => {
        return new Promise((resolve, reject) => {
            _fetchByContext(messages => { 
                dispatch({ type: RECEIVE_MESSAGES, ... });
                resolve(messages);
            });
        });
    };
};

export function subscribeByContext(contextId) {
    return dispatch => {
        return new Promise((resolve, reject) => {
            _subscribeByContext(messages => { 
                dispatch({ type: RECEIVE_MESSAGES, ... });
                resolve(messages);
            });
        });
    };
};

export function selectItem(contextId) {
    return dispatch => {
        // CALL IN SERIES
        return dispatch(subscribeByContext(contextId))
            .then(() => dispatch(fetchByContext(contextId)));
        // CALL IN PARALLEL (alternative to the code above; this is probably not what you want - just keeping for reference)
        return Promise.all(
            dispatch(subscribeByContext(contextId)),
            dispatch(fetchByContext(contextId))
        );
    };
}

繰り返しますが、上記のコードはテストされていないことに注意してください。一般的な解決策のアイデアを提供することを願っています。

于 2016-05-30T08:22:07.497 に答える