Я получаю свои координаты, но состояние "данных" не обновляется

Question

Я пытаюсь сделать простое приложение для реагирования на погоду, которое получает текущее местоположение пользователей с помощью метода геолокации. И я хочу, чтобы api ожидал отображения, пока не получит их координаты. Он получает мои координаты и данные, но не обновляет состояние значения «данные». Возможно, я не указываю правильный ключ / значение или что-то в этом роде.

Песочница кода
Данные получены

Answer 1

Ваш запрос работает, вы просто неправильно анализируете ответ. Если вы посмотрите в консоль, вы увидите, что ответ data - это объект, содержащий массив с именем data. Вы пытаетесь присвоить значение своего города свойству, которого нет в объекте root, а в объекте, содержащемся в массиве данных.

Попробуйте изменить это:

const data = await api_call.json();

this.setState({
  latitude: latitude,
  longitude: longitude,
  city: data.city_name,
  data: data,
  isLoaded: true
});

на это:

const {data} = await api_call.json();

this.setState({
  latitude: latitude,
  longitude: longitude,
  city: data[0].city_name,
  data: data[0],
  isLoaded: true
});

Также было бы разумно попытаться обработать 0 или более 1 объектов в массиве data.

Также стоит упомянуть, что эта строка:

const {data} = await api_call.json();

называется деструктуризацией объекта и аналогична следующей:

let data = await api_call.json();
data = data.data;