Question

我有以下代码：

import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/switchMap';

import {
    PREVIEW_GROUP_STARTED,
    previewGroupSuccess,
    previewGroupFail
} from '../../actions/groups-actions-creators';
import ApiUtils from '../../util/ApiUtils';

export const previewGroupEpic = action$ =>
    action$
        .ofType(PREVIEW_GROUP_STARTED)
        .switchMap(action => {
            console.log({ action });
            const { whereCriteria, groupType } = action;
            const previewGroupObservable = getPreviewGroupObservable({
                whereCriteria,
                groupType
            });
            return previewGroupObservable
                .map(({ table, widget }) => {
                    if (!table) {
                        table = [];
                    }
                    if (!widget) {
                        widget = [];
                    }
                    return previewGroupSuccess({ tableData: table, graphData: widget });
                })
                .catch(error => {
                    console.log('preview group catch!');
                    return Observable.of(previewGroupFail({ error }));
                });
        });

const getPreviewGroupObservable = ({ whereCriteria, groupType }) => {
    console.log(whereCriteria);
    const body = {
        whereCriteria: whereCriteria,
        groupType
    };
    const api = `/webApi/smartFilterGrouping/groups/preview`;

    return Observable.fromPromise(ApiUtils.post(api, body))
        .catch(err => {
            console.log(err);
            throw 'Could not get create group Observable';
        })
        .map(response => {
            if (response && response.data && response.data.mainData) {
                return response.data.mainData;
            } else {
                console.log('preview group Observable map - bad response:', response);
                throw 'Could not preview group';
            }
        })
        .catch(err => {
            console.log(err);
            throw 'Could not preview group';
        });
};

switchMap无法正常工作（我猜我在错误的地方使用它-无法理解应该去的地方以及我缺少的东西）-如果我分派2个PREVIEW_GROUP_STARTED操作即使第一个尚未完成（尚未发布PREVIEW_GROUP_SUCCESS）-我将从史诗中获得2个PREVIEW_GROUP_SUCCESS操作。

这有时会导致非常糟糕的情况，其中向用户显示的结果是较早的预览请求（竞赛条件出了错：）。

我知道switchMap是我需要的运算符，只是我不了解如何正确使用它。

我该怎么做才能只调度一个PREVIEW_GROUP_SUCCESS（最新 PREVIEW_GROUP_START调度动作的结果）？

我在做什么错了？

谢谢。

如何在redux-observable中正确使用switchMap

0 个答案: