未处理的拒绝（TypeError）：无法读取未定义的属性“错误”答案

【问题标题】：Unhandled Rejection (TypeError): Cannot read property 'error' of undefined未处理的拒绝（TypeError）：无法读取未定义的属性“错误”
【发布时间】：2020-04-29 14:17:48
【问题描述】：

我对 React 还很陌生，我一直在尝试创建一个注册页面，但是，我遇到了这个错误。有人可以告诉我应该怎么做才能解决这个错误吗？

报名方式：

//  = Action =
// Sign up
export const signup = user => {
    return fetch(
        `${API}/signup`,
        {
            method: 'POST',
            headers: {
                Accept:'application/json',
                'Content-Type' : 'application/json'
            },
            body: JSON.stringify(user)
        })
        .then(response => {
            return response.json();
        })
        .catch(err => console.log(err));
}

【问题讨论】：

表示数据未定义。与反应无关。从注册返回的承诺可能没有解析一个值，所以数据是未定义的
你能分享你的signup方法吗？
@Hurobaki，我已经添加了注册方法

标签： reactjs mongodb

【解决方案1】：

重写注册方法（ps：我只更改了 .catch 处理程序）

// Sign up
export const signup = user => {
    return fetch(
        `${API}/signup`,
        {
            method: 'POST',
            headers: {
                Accept:'application/json',
                'Content-Type' : 'application/json'
            },
            body: JSON.stringify(user)
        })
        .then(response => {
            return response.json();
        })
        .catch(err => 
           console.log(err));
           return err;
}

【讨论】：

【解决方案2】：

您需要将 fetch 逻辑包装在 Promise 中，以将值返回给调用者。

export const signup = user => {
    return new Promise((resolve, reject) => {
      fetch(`${API}/signup`,
        {
            method: 'POST',
            headers: {
                Accept:'application/json',
                'Content-Type' : 'application/json'
            },
            body: JSON.stringify(user)
        })
        .then(response => response.json())
        .then(jsonData => resolve(jsonData))
        .catch(err => resolve({error: `something went wrong err : ${err}`}));
  })
}

signup(user).then(data => {
  if (data.error) {
    // handle error case 
  } else {
    // handle success case
  }
})

现在您的signup 方法将返回一个值。您的 data 变量将不再是 undefined。

希望对你有帮助，欢迎添加 cmets 或询问我更多详情

【讨论】：