React api 调用 returns [object Object] [object Response] 或 [object Promise]

React api call returns [object Object] [object Response] or [object Promise]

我正在使用开放的天气图制作一个非常简单的天气应用 API。我得到的唯一响应是 [object Object] 当它是 axios 调用时,[object Response] 当我使用 fetch 时,[object Promise] 当我控制台日志 res.json() 时。我在控制台中收到一条成功的 GET 消息。我现在很困。

如何访问应该返回的带有天气的对象?

感谢任何帮助。

const Weather = (props) => {

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

const handleChange = event => {
 event.persist()

 setLocation(prevLocation => {
   // console.log(`previous ${prevLocation}`)
   // console.log(`target ${event.target.value}`)
   const updatedInput = { [event.target.name]: event.target.value }
   // console.log(`updated ${updatedInput}`)
   const createdLocation = Object.assign({}, prevLocation, updatedInput)
   // console.log(`created location ${createdLocation.toString()}`)
   return createdLocation.location
 })
}

console.log(`LOCATION = ${location}`)

const handleSubmit = (event) => {
 event.preventDefault()
 fetch(`https://api.openweathermap.org/data/2.5/weather?q=${location}&appid=${apiKey}`)
   .then(res => {
     console.log(`RES = ${res.json()}`)
   })
   .catch(console.error)
}

此外,如果有更好的方式来问这个问题,我也会做一些笔记。

您得到了正确的响应,您只需要使用 object properties 访问数据。 尝试:

fetch(`https://api.openweathermap.org/data/2.5/weather? 
  q=${location}&appid=${apiKey}`)
  .then(res => res.json())
  .then(data=>setWeather(data.weather.main)