React Native:如何根据API响应来解决用户名和密码的错误

时间:2019-02-12 09:26:03

标签: validation react-native

在验证文本字段是否为空之前,我已经从api获得响应。现在,在获得响应之后,需要验证用户名和密码是否错误,然后再通过“无效的用户名/密码”之类的错误进行验证。如果有人知道,请告诉我。

async submit() {        
  //Validating username and password
   const { username, password } = this.state;
   if(username == ''){
      this.setState({error:'Username is required'});
   } else if(password == ''){
      this.setState({error:'Password is required'});
   } else {     
    this.setState({error: null})  
    let collection={};
    collection.username=this.state.username;
    collection.password=this.state.password;
    // console.warn(collection);

    var url = 'my url';
      try {
        let response = await fetch(url, 
        {
          method: 'POST', // or 'PUT'
          body: JSON.stringify(collection), // data can be `string` or {object}!
          headers: new Headers({
            'Content-Type': 'application/json'
          })
        });
        let res = await response.text();
      // console.warn(res);

      if (response.status >= 200 && response.status < 300) { 
        //Handle success
        let accessToken = res;
        console.log(accessToken);
        //On success we will store the access_token in the AsyncStorage
        this.storeToken(accessToken);
        // console.warn(accessToken);
        //After storing value,it will navigate to home 
        this.props.navigation.navigate('Home');

      } else {
        //Handle error
        console.log('Success:',response);
        let error = res;
        throw error;
      }
    } catch(error) { 
        console.log("error " + error);
    } 
  }
}

输入无效的用户名/密码后的响应:

0   {…}
field   :password
message :Incorrect username or password.

1 个答案:

答案 0 :(得分:0)

我已经根据状态编写了这样的代码来验证用户名/密码是否正确/错误。因此,如果将来对任何人都有用,那么这里就是发布代码。

 if (response.status >= 200 && response.status < 300) { 
       //Handle success

       let accessToken = res;
       //On success we will store the access_token in the AsyncStorage
       this.storeToken(accessToken);
       console.warn(accessToken);
       //After storing value,it will navigate to home 
       this.props.navigation.navigate('Home'); 

    } else {
       console.log('Success:',response);
       this.setState({error:'Invalid username/password'});
       let error = res;
       throw error;
    }