ESLint显示错误，建议使用try...catch。

Question

目前，我正在学习一门课程。前端网页开发与React 在coursera中，我被卡在了一个点上，老师正在演示如何使用交叉取样来获取数据。在这里，他展示的是

export const fetchDishes = () => (dispatch) => {
  return fetch(baseUrl + 'dishes')
    .then(
      (response) => {
        if (response.ok) {
          return response;
        } else {
          var error = new Error(
            'Error ' + response.status + ': ' + response.statusText
          );
          error.response = response;
          throw error;
        }
      },
      //manually handle error if the server didn't response
      (error) => {
        var errmess = new Error(error.message);
        throw errmess;
      }
    )
    .then((response) => response.json())
    .then((dishes) => dispatch(addDishes(dishes)));
    .catch(error => dispatch(dishesFailed(error.message)));
};

但我的ESLint显示错误，建议使用try...catch block。

图片

但是我很奇怪，为什么老师按上面的写法写了，而且完美地运行了应用程序，却出现了这个错误？我不知道如何将这段代码转换成try...catch块。

---

@erik_m 给了一个解决方案，但我确实得到了分号是指终止承诺链吗？还有一件事，我觉得老师没有导入fetch(比如说...)。import fetch from 'cross-fetch'那么我的应用是如何使用fetch的呢？他只是演示了做yarn add [email protected] fetch是默认继承于react应用的吗？

Answer 1

你是在catch上方一行终止调用。

.then((response) => response.json())
    .then((dishes) => dispatch(addDishes(dishes)));
    .catch(error => dispatch(dishesFailed(error.message)));

在.catch上面的一行，去掉分号和paren。你的catch不是你的then语句的正确部分。

编辑：你能试着把最后三行替换成这样吗？你的parens和分号放错了地方。所以程序认为你是在第二个then之后结束你的承诺，所以它没有识别 "catch "部分。

.then((response) => response.json())
    .then((dishes) => dispatch(addDishes(dishes))
.catch(error => dispatch(dishesFailed(error.message))));