使用fetch w / react js访问返回的promise中的对象

时间:2016-08-03 00:46:12

标签: javascript reactjs fetch

我有这个功能:

  getUserData() {
    fetch(this.props.apiUrl + this.state.username + '?client_Id=' + this.props.clientId + '&client_secret=' + this.props.clientSecret)
      .then(function(response) {
        var data = response.json();
        this.setState({
          userData: data
        });
        console.log(this.state.userData);
      }.bind(this))
      .catch(function(error) {
        this.setState({
          username: null
        });
        console.log(error)
      }.bind(this)) 
  }

在控制台中返回此内容:

承诺{[[PromiseStatus]]:"待定",[[PromiseValue]]:undefined}

  [[PromiseStatus]]:"已解决"

[[PromiseValue]] : Object
avatar_url : "https://avatars.githubusercontent.com/u/"
login      : "hello world"
.
.
.

我需要访问对象中的名称/值对,但我无法访问它们。我假设在将响应转换为json后我需要再采取一步,但无法弄清楚。如果有人可以提供帮助,将不胜感激!

2 个答案:

答案 0 :(得分:11)

response.json()会返回一个承诺,因此您还需要妥善处理,例如:

.then(function(response) {
    return response.json();
})
.then(function(parsedData) {
    // data here
})

答案 1 :(得分:5)

这是处理json对象的一种更短的方法

fetch(endpoint, request)
.then(response => response.json())
.then(json => {
  //handle json response
}