Question

所以，我当前的代码看起来像这样：

成分：

requestDescriptions(params, bothGender) {
    if (bothGender) {
        // men request
        params.gender = 'men';
        this.props.getDescriptions(params);
        // women request
        params.gender = 'women';
        this.props.getDescriptions(params);
    } else {
        this.props.getDescriptions(params);
    }
}

我的行动如下：

export function getDescriptions(params = { brand: null, category: null, gender: null }) {
return (dispatch) => {
    dispatch(requestDescription());
    return request
        .get(`${getApiUrl()}plp?${QueryString.stringify(params)}`)
        .end((err, res) => {
            if (err && res.statusCode !== 404) {
                ...
            }
            if (res.statusCode === 404) {
                // HERE: 
                console.log(params.gender); 
                return dispatch(receiveEmptyDescription(params));
            }
            return dispatch(receiveDescription(res.body));
        });
};

}

到目前为止，我没有注意到这个错误，但是当我开始测试两个API调用都返回404的情况时，我才发现错误。

错误是对同一端点的并发调用会覆盖我的参数。当API返回200时，我看不到问题。但现在，当我测试返回404时，我可以清楚地看到问题。

我遇到的问题在于：

this.props.getDescriptions(params);
params.gender = 'women';

如果我在我的操作（//HERE）中检查控制台日志，则在params.gender两个案例中'women'都会显示'men'，即使它第一次应该是Subject < / p>

我想这可以使用承诺修复吗？

如果我不够清楚，请告诉我。

Answer 1

问题实际上并非您正在发出并行请求，或者您正在获取HTTP2XX或HTTP4XX。

您始终看到gender等于'women'的原因是您对两个请求使用相同的对象实例，即params

发生的事情是，您将params.gender设置为'men'，触发第一个请求，将params.gender设置为'women'，点燃第二个请求。< / p>

在完成任何请求之前，所有上述步骤都会同步发生。

这意味着在任何请求完成之前很久，params.gender已经等于'women'。

只需向每个操作发送一个不同的对象。

requestDescriptions(params, bothGender) {
    if (bothGender) {
        // men request
        this.props.getDescriptions({ ...params, gender: 'men' });

        // women request
        this.props.getDescriptions({ ...params, gender: 'women' });
    } else {
        this.props.getDescriptions(params);
    }
}

由于你已经在使用Redux，你应该知道变异是baaaad

反应并发API调用

1 个答案: