我正在获取我的坐标，但 'data' 的状态没有更新

Question

我正在尝试制作一个简单的反应天气应用程序，它使用地理定位方法获取用户当前位置。我希望 api 等待显示，直到它检索到它们的坐标。它获取我的坐标和数据，但不更新 'data' 值的状态。也许我没有指向正确的 key/value 或其他东西。

Code Sandbox
Data is retrieved

Answer 1

您的请求正在运行，您只是没有正确解析响应。如果您查看控制台，您会发现数据响应是一个包含名为数据的数组的对象。您正在尝试将您的城市值分配给属性，它不存在于根对象中，而是存在于数据数组中包含的对象中。

尝试改变这个：

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
});

尝试处理 data 数组中的 0 个或多于 1 个对象也是明智的。

还值得一提的是这一行：

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

被称为 object destructuring 并且与这样做相同：

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

我正在获取我的坐标，但 'data' 的状态没有更新

Im getting my coordinates but the state of 'data' isnt updating

javascript

api

weather

reactjs