无法读取属性“未定义的统计信息”

时间:2019-01-20 19:26:12

标签: reactjs

enter image description here试图用axios + node.js进行api调用,但是在控制台中获取数据,但是当我尝试检索嵌套值时却得到错误无法读取未定义的属性“ statistics”。在控制台中,当我将鼠标悬停在它上面时,我得到data.data。[0] .statistics.population_density.value但在我的代码中它不起作用。 有人可以解释imi做错了什么吗?谢谢

 [
   data:
      {
        data: Array(1) {

          0: {

  {
    "statistics": {
      "population_density": {
        "source_name": "NASA Socioeconomic Data and Applications Center (SEDAC) – Hosted by CIESIN at Columbia University",
        "value": 13543,
        "description": "The number of inhabitants per square kilometer around this point."
      }
    },
    "location": {
      "latitude": 37.769456,
      "longitude": -122.429128
    }
  }
]


handleSelect = address => {
    this.setState({
        address,
    });

    console.log(this.state.address);

    geocodeByAddress(address)
        .then(res => getLatLng(res[0]))
        .then(({
            lat,
            lng
        }) => {
            this.setState({
                latitude: lat,
                longitude: lng,
                isGeocoding: false,
            });

            this.setState({
                isLoaded: true
            });
        })
        .catch(error => {
            this.setState({
                isGeocoding: false
            });
            console.log('error', error); // eslint-disable-line no-console
        });

    console.log(this.state.latitude);
    console.log(this.state.longitude);

    var param = {
        lat: this.state.latitude,
        long: this.state.longitude,
        temp: 1,
    };
    axios
        .post(`http://localhost:5000/search-data`, {
            param,
        })
        .then(data => {
            console.log(data);
            this.setState({
                value: data.data[0].statistics.population_density.value,
            });

        });

};

2 个答案:

答案 0 :(得分:1)

您需要data.data.data[0]

.then(data => {
        console.log(data);
        this.setState({
            value: data.data.data[0].statistics.population_density.value,
        });

    });

console.log(data)的输出表明,此对象(存储在名为data的变量中)具有一个名为data的属性,而该属性又又具有一个名为{{ 1}}。

答案 1 :(得分:0)

我建议将data参数重命名为response,因为那是axios实际为您提供的:

.then(response => {
    console.log(response);
    this.setState({
        value: response.data.data[0].statistics.population_density.value
    });
});

然后该错误应该很明显。 response不仅包含数据。