将承诺转换为异步/await-Javascript

我在React中有一个dataService函数，它执行API获取。我尝试转换为异步/等待块，但似乎遇到了障碍

使用承诺：

const dataService = (url, options, dataToPost) => {

    return (dispatch, getState) => {
        const { requestAction, successAction, failureAction } = options.actions;

        if (options.shouldRequest(getState())) {
            dispatch(requestAction());
            const promise = axios.get(url, { withCredentials: true });
            return promise
                .then(response => {
                    if (response.status === 200) {
                        return dispatch(successAction(response, dispatch));
                    }
                    return Promise.reject(response);
                })
                .catch(error => {
                    if (error.response.status === 302) {
                        window.location = '/view';
                    }
                    dispatch(openErrorDialog());
                    return dispatch(failureAction(error));
                });
        }
        return Promise.reject(new Error('FETCHING'));
    };
};

使用异步/等待：

constdataservice=async（url、选项、dataToPost）=>{
返回异步（dispatch，getState）=>{
让url；
const{requestAction，successAction，failureAction}=options.actions；
if（options.shouldRequest（getState（）））{
分派（requestAction（））；
const promise=axios.get（url，{withCredentials:true}）；
试一试{
const response=等待承诺；
如果（response.status==200）{
返回调度（成功操作（响应、调度））；
}
退货承诺。拒绝（回复）；
}捕获（错误）{
返回调度（故障动作（错误））；
}
}
return Promise.reject（新错误（'FETCHING'））；
};
};

等待axios.post（url，数据，{withCredentials:true}）

不返回承诺，它返回请求的真实响应

在使用异步等待时，不要使用then catch，而是使用try catch。 这是解决办法

try {
    const response = dataToPost
        ? await axios.post(url, data, { withCredentials: true })
        : await axios.get(url, { withCredentials: true });
    if (response.status === 200) {
        return dispatch(successAction(response, dispatch));
    }
    return Promise.reject(response);
} catch (err) {
    if (error.response.status === 302) {
        window.location = '/view';
    }
    dispatch(openErrorDialog());
    return dispatch(failureAction(error));
}

---

如果您确实想更改Promise->async/await，则更改如下：

首先，您不希望dataService是异步的，因为这意味着它将返回一个承诺，这将改变调用它的方式—您不需要这样做

第二，改变

  const promise = axios.get ...
  promise.then(response ....

到

行不通

这是必须的

const response = await axios.get ...

不需要promise变量

即使如此，您仍然在转换代码中使用承诺。。。现在，它的不同之处在于，它无缘无故地使用了

async

关键字

下面是如何将（原始）代码转换为async/await

注意以下内容中完全没有“承诺”一词：

const dataService = (url, options, dataToPost) => {

    return async (dispatch, getState) => {
        const { requestAction, successAction, failureAction } = options.actions;

        if (options.shouldRequest(getState())) {
            const data = typeof dataToPost === 'string' ? { data: dataToPost } : dataToPost;
            dispatch(requestAction());
            try {
                const response = dataToPost
                    ? await axios.post(url, data, { withCredentials: true })
                    : await axios.get(url, { withCredentials: true });
                if (response.status === 200) {
                    return dispatch(successAction(response, dispatch));
                }
                throw response;
            } catch(error) {
                if (error.response.status === 302) {
                    window.location = '/view';
                }
                dispatch(openErrorDialog());
                return dispatch(failureAction(error));
            }
        }
        throw new Error('FETCHING');
    };
};

---

你所做的毫无意义，因为

const promise=dataToPost

不会是一个承诺-让我们面对它，您所做的只是将

数据服务标记为async，因此现在它不会返回在中声明的函数，而是返回该函数的承诺尝试将async关键字从数据服务中删除到
数据服务=（url、选项、dataToPost）
这可能会有帮助：@Ben:？？？每个
async
函数都返回一个
Promise
对象。
await
语句对
Promise
进行操作，等待
Promise
解决或拒绝。所以@Gianfranco Fertino是正确的。
const dataService = (url, options, dataToPost) => {

    return async (dispatch, getState) => {
        const { requestAction, successAction, failureAction } = options.actions;

        if (options.shouldRequest(getState())) {
            const data = typeof dataToPost === 'string' ? { data: dataToPost } : dataToPost;
            dispatch(requestAction());
            try {
                const response = dataToPost
                    ? await axios.post(url, data, { withCredentials: true })
                    : await axios.get(url, { withCredentials: true });
                if (response.status === 200) {
                    return dispatch(successAction(response, dispatch));
                }
                throw response;
            } catch(error) {
                if (error.response.status === 302) {
                    window.location = '/view';
                }
                dispatch(openErrorDialog());
                return dispatch(failureAction(error));
            }
        }
        throw new Error('FETCHING');
    };
};