Reactjs 如何在react中将openweather数据从组件渲染到子组件？

我正在尝试从GetWeather.js组件加载开放天气api中的数据，并将结果加载到我的page.js组件中

当我使用fetch加载数据并尝试在组件内呈现DOM元素时，我得到一个错误

error:Objects作为React子对象无效（找到：带有键{}的object）。如果要呈现子对象集合，请改用数组。

这就是该组件的外观

import React，{useState，useffect}来自“React”
常量api={
键：“…”，
基数：'https://api.openweathermap.org/data/2.5/',
}
const GetLocationWeather=（{lat，lon}）=>{
const[weather，setWeather]=useState（{}）
useffect（（）=>{
取回(
`${api.base}天气？lat=${lat}&lon=${lon}&units=imperial&APPID=${api.key}`
)
.然后（（res）=>res.json（））
。然后（（结果）=>{
设置天气（结果主温度）
})
}，[lat，lon]）
返回{weather}
}
导出默认GetLocationWeather

我想在另一个显示天气数据的文件中使用此组件：

从“../components/OpenWeather”导入GetLocationWeather

问题是，当我想在GetLocationWeather.js的return语句中呈现任何内容时，我得到的错误是

对象作为React子对象无效