Question

对于我的ReactNative项目：我目前正在尝试访问天气API并检索.json文件，将其存储在我的状态变量中，然后访问.json文件中的相关对象（例如：当前温度）等）。

我能够通过我的组件状态访问整个.json文件。但是，当我尝试访问对象（例如：当前温度）时，我收到此错误。我很确定我使用正确的JSON密钥名称来访问它，所以不确定是什么错误。

TypeError: Cannot read property 'temp_c' of undefined

这是我的代码：

class App extends Component {
  state = {weatherResponse: []}; // the state of the App component

  componentWillMount() {
    axios.get('http://api.apixu.com/v1/current.json?key=KEY&q=Paris')
      .then(
        function(response) {
          //console.log(response.data);
          this.setState({weatherResponse: response.data}); //here, I store the json file into the state.
        }.bind(this)
      );
  }

  render() {
    console.log(this.state.weatherResponse); //this works, no problem.
    console.log(this.state.weatherResponse.current.temp_c); //this returns the error below.

这是JSON文件：

{
  "location": {
     "name": "Paris",
     "region": "Ile-de-France",
     "country": "France",
  },
  "current": {
     "last_updated_epoch": 1517616126,
     "last_updated": "2018-02-03 01:02",
     "temp_c": 2,
     "temp_f": 35.6,
     "is_day": 0,
     "cloud": 75
  }
}

你能帮帮忙吗？谢谢！

Answer 1

在您的初始渲染中this.state.weatherResponse为空，只有在您的api请求完成且状态更新后才会获取数据。在尝试访问之前，您应该检查weatherResponse是否包含该值。

在状态中访问JSON - ReactNative

1 个答案: