ReactJS：页面首次加载时如何自动设置并加载默认API数据？

你不需要新增类似setData的变量，只需要借助React的useEffect钩子实现组件首次加载自动触发请求即可，具体修改步骤如下：

• 第一步：在React导入语句中新增useEffect引入
  示例代码：

  import { useState, useEffect } from 'react'
  

• 第二步：在组件内的getWeatherData函数定义之后，添加useEffect逻辑，空依赖数组代表仅在组件首次挂载完成后执行一次：
  新增代码：

  useEffect(() => {
    // 首次加载自动请求默认城市istanbul的天气数据
    getWeatherData()
  }, [])
  

• 可选优化项：
  1. 给input输入框添加value={city}属性，实现输入框内容和city状态的双向绑定，否则你设置的默认city值不会显示在输入框中
  2. 你当前代码中的状态设置函数存在拼写错误：setWineSpeed应当改为setWindSpeed，和前面定义的状态名windspeed对应

内容的提问来源于stack exchange，提问作者Batuhan Can