Получение неопределенного значения при получении json в реакции на натив - PullRequest
Новая
       33

Получение неопределенного значения при получении json в реакции на натив

0 голосов
/ 19 сентября 2018

В моем упрощенном коде ниже я могу получить данные в формате JSON, но если я попытаюсь записать в журнал определенный ключ объекта, я получаю неопределенное значение.

Я думал, что смогу использовать this.state.profile.name для отображения "Стивен".Почему это выглядит как undefined, когда я могу увидеть весь ответ?Спасибо! 

state = {
responseJSON: null,
};
callGraph = async token => {

const response = await fetch(
  `https://graph.facebook.com/me?access_token=${token}&fields=id,name,email,about,picture`
);
const responseJSON = JSON.stringify(await response.json());

  this.setState({ 
    profile: responseJSON
  });

console.log("profile = " + this.state.profile);
};

это console.log выводит следующее: 

profile = {"id":"*******","name":"Steven *******","email":"steve@*******.com","picture":{"data":{"height":50,"is_silhouette":false,"url":"https://platform-lookaside.fbsbx.com/platform/profilepic/?asid=*******&height=50&width=50&ext=1539943832&hash=AeQM2VfUBmdfOVJZ","width":50}}}

Ответы [ 2 ]

0 голосов
/ 19 сентября 2018

setState является асинхронным.Ответ Кевина совершенно прав.Однако вы также можете использовать этот метод для немедленного просмотра результата: 

this.profile= responseJSON;
console.log("profile = " + this.profile);

Вы также должны определить его в конструкторе следующим образом: 

  constructor(props) {
    super(props);
    this.profile='';
   }

Кроме того, чтобы получить доступ кпараметр профиля на вашем экране необходимо использовать this.profile.

0 голосов
/ 19 сентября 2018

setState является асинхронным.

В вашем коде вы пытаетесь console.log до обновления состояния.

Вам необходимо использовать обратный вызов в качестве второго аргументаsetState функция: 

 this.setState({ 
    profile: responseJSON
  }, () => {
console.log("profile = " + this.state.profile);

});

Проверьте этот пост для получения дополнительной информации или также этот другой вопрос

...