注册账户函数报错：Unhandled Rejection (TypeError) 无法读取undefined的data属性

错误原因 #

• 当axios请求失败进入catch块时，catch仅执行console.log(err)且无返回值，导致res变量变为undefined
• 后续代码尝试读取res.data时，触发「无法读取undefined的data属性」的TypeError
• 额外提醒：原代码中await res.data是多余的，res.data是axios已解析完成的同步数据，无需异步等待

解决办法 #

方法一：用try/catch统一处理异步错误 #

const sendRequest = async () => {
    if (!name || !email || !password) return;
    const user = { name, email, password };
    try {
      const res = await axios.post('/api/v1/auth/register', { user });
      return res.data;
    } catch (err) {
      console.log(err);
      // 可选：添加用户可见的错误提示，比如弹窗提示注册失败
      // throw err; // 若需让上层handleSubmit捕获错误，可抛出
    }
};

const handleSubmit = (e) => {
    e.preventDefault();

    sendRequest()
      .then(() => setMloggi(true))
      .catch((err) => {
        console.log('注册失败:', err);
        // 这里可以处理注册失败后的用户反馈
      });
};

方法二：修复axios的catch逻辑 #

const sendRequest = async () => {
    if (!name || !email || !password) return;
    const user = { name, email, password };
    try {
      const res = await axios.post('/api/v1/auth/register', { user });
      return res.data;
    } catch (err) {
      console.log(err);
      // 可选：返回错误信息对象，供上层判断
      return { error: err.message };
    }
};

const handleSubmit = (e) => {
    e.preventDefault();

    sendRequest().then((result) => {
      if (!result?.error) {
        setMloggi(true);
      } else {
        console.log('注册失败:', result.error);
        // 处理错误提示
      }
    });
};

内容的提问来源于stack exchange，提问作者Mohamed Ali Elansari