首页 > 解决方案 > 未处理的拒绝(typeError):无法在谷歌浏览器移动设备上使用 reactjs axios 读取未定义的属性

问题描述

在我的笔记本电脑的谷歌浏览器中输入不正确的信息时,我收到错误响应这是我的笔记本电脑浏览器中使用此代码的响应的屏幕截图

axios
        .post(`${strapi}/auth/local`, loginData)
        .then(res => {
          if (undefined === res.data.jwt) {
            this.setState({error: res.data.message, Loading: false});
            return;
          }

          sessionStorage.setItem('JWT', res.data.jwt);
          sessionStorage.setItem('username', res.data.user.username);
          sessionStorage.setItem('role', res.data.user.role.type);


          this.setState({Loading: false, token: res.data.jwt, username: res.data.user.username, userEmail: res.data.user.email, isLoggedIn: true});
          // window.location.href = '/';
        })
        .catch(err => {
          this.setState({
            error:err.response.data.message[0].messages[0].message
          })
          console.log(this.state.error)
        })

但是,当使用相同的代码行登录到我的移动 chrome 浏览器时,这会出现 移动屏幕截图

如何解决这个问题?

标签: javascriptreactjsmobileaxiostypeerror

解决方案


当您没有收到 error.response 时会发生此类错误。

因此,如果您遇到任何未知错误,您可以设置默认消息。

     let MESSAGE;

     if(error.response){
         MESSAGE = err.response.data.message[0].messages[0].message
     }else{
          MESSAGE = 'Something went wrong.'
     }

     this.setState({
         error: MESSAGE
      })

否则你可以记录你的错误为什么会发生这种情况

 console.log('error',error) 

推荐阅读