解析Openweathermap请求,未处理的拒绝(TypeError):无法读取未定义的属性'speed'

问题描述 投票:0回答:1

我正在尝试访问openweathermaps API以获取特定位置的风速。但这每次都会使我出错。

未处理的拒绝(TypeError):无法读取以下内容的属性'speed'未定义

这是我的位置信息类(或我所说的Spot):

import React, { Component, setState } from 'react'
import { Map, TileLayer, Marker, Popup } from 'react-leaflet';
import L from 'leaflet';
import axios from 'axios';

var owmApiKey = 'HIDDEN FROM STACKOVERFLOW';

var myIcon = L.icon({ //SETS UP THE PIN ICON THAT IS USED TO PLOT MARKERS ON THE MAP
    iconUrl: 'https://cdn0.iconfinder.com/data/icons/small-n-flat/24/678111-map-marker-512.png',
    iconSize: [41,41],
    iconAnchor: [12.5,41],
    popupAnchor: [0, -41]
});

export default class Spot extends Component {

    constructor(props) {
        super()
        this.state = {
            county_name: props.county_name,
            latitude: props.latitude,
            longitude: props.longitude,
            spot_id: props.spot_id,
            spot_name: props.spot_name,
            wind_speed: 0,
        }
    }

    getWindSpeed = (lon, lat) => {//THE FUNCTION TO POPULATE THE LIST OF SPOTS USING AXIOS
            fetch(`api.openweathermap.org/data/2.5/weather?lat=${this.state.latitude}&lon=${this.state.longitude}&appid=${owmApiKey}`)
            .then(res => {
                this.setState({
                    wind_speed: res.wind.speed
                });
            });
    }

    componentDidMount() {
        this.getWindSpeed();
    }

    render() {
        return(
        <Marker position={[this.state.latitude,this.state.longitude]} icon={myIcon}>
            <Popup>
                {this.state.spot_name + ", " + this.state.county_name + " Wind Speed: " + this.state.wind_speed}
            </Popup>
        </Marker>    
        )
    }

}
javascript reactjs fetch openweathermap
1个回答
0
投票

您确定您在res.wind中获得了速度属性如果您不介意,也可以发送从您的api获得的res

© www.soinside.com 2019 - 2024. All rights reserved.