为什么我在这里获取数据时出错？

Question

我有这个用于在 state 中保存获取的数据：

import React, {useState, useEffect, createContext} from 'react';


import { getLocation } from '../api';

export const LocationContext = createContext();

const LocatonContextProvider = (props) => {

const [location, setLocation] = useState({})

useEffect(() => {
    const fetchAPI = async () => {
        setLocation(await getLocation());
    }

    fetchAPI();
}, [])


return (
    <LocationContext.Provider value={location}>
        {props.children}
    </LocationContext.Provider>
);
};

export default LocatonContextProvider;

这用于保存天气数据 import React, {useState, useEffect, createContext, useContext} from 'react';

 //api
 import { getWeather } from '../services/api';

//Context
import { LocationContext } from '../contexts/LocationContextProvider';

export const WeatherContext = createContext()

const WeatherContextProvider = ({children}) => {

const location = useContext(LocationContext);
const lat = location.lat;
const lon = location.lon;

const [weather, setWeather] = useState({});

useEffect(() => {
    const fetchAPI = async () => {
        setWeather(await getWeather(lat,lon));
    }
    fetchAPI();
}, [lat, lon])

return (
    <WeatherContext.Provider value={weather}>
        {children}
    </WeatherContext.Provider>
);
};

export default WeatherContextProvider;

这是 axios 请求：从“axios”导入 axios；

const getLocation = async () => {

const LOCATION_URL = 'http://ip-api.com/json/?fields=country,city,lat,lon,timezone';

const response = await axios.get(LOCATION_URL);
return response.data;
}


const getWeather = async (lat, lon) => {

const WEATHER_URL = `https://api.openweathermap.org/data/2.5/weather? 
lat=${lat}&lon=${lon}&appid=bac9f71264248603c36f011a991ec5f6`;

const response = await axios.get(WEATHER_URL)
return response.data;
}


export {getLocation, getWeather};

当我刷新页面时，我得到一个 400 错误，然后我得到数据，我不知道为什么会发生错误

Answer 1

useEffect(() => {
    const fetchAPI = async () => {
        setWeather(await getWeather(lat,lon));
    }
    
    if (lat && lon) {
      fetchAPI();
    }
}, [lat, lon])