Unable to read response object on react

Question

My django api responds with the username if the user is authenticated and a not authenticated details msg if not authenticated, but I am unable to read the status code or console log or catch the 401 status code and res.status gives undefined msg:

console img

How can I use http status to render depending on the code received?

export default class GetUser extends Component {.....}

  componentDidMount(){
    fetch("http://127.0.0.1:8000/app/ebooks/",
    { CSRF_TOKEN.....
      },

     })
     .then(res => res.json())
    .then(res => { 
      this.setState({data:[res]})
      console.log(resp.status)  ---> UNDEFINED
    })
    .catch(err => console.log(err));
  }

  
  render() {
    var x = this.state.data

      return (
      <pre>{JSON.stringify(x, null, 2) }</pre>

    )
  }
}

Answer 1

Move the console.log() up to the first then clause.

     .then(response => {
         console.log(response.status) --> 401
         return response.json()
     })
    .then(data => { 
      this.setState({data:[data]})
    })
    .catch(err => console.log(err));