React中调用setUsers报错setUsers is not a function怎么解决

问题原因 #

React 内置的 useState Hook 返回值为数组结构，而非对象结构。你当前使用对象解构的语法来取值，无法匹配数组的下标对应规则，因此解构得到的 setUsers 实际为 undefined，调用时就会触发「不是函数」的类型错误。

修复方案 #

• 将状态定义行的对象解构（大括号{}）替换为数组解构（方括号[]）即可解决报错，修改后的状态定义代码如下：

const [users, setUsers] = useState([]);

• 可选优化：你调用的接口返回的用户列表封装在响应体的results字段下，如果直接将整个响应对象存入users状态，后续渲染时需要额外嵌套取值。可以直接将用户列表存入状态，修改fetchUsers内的状态更新逻辑：

const fetchUsers = async () => {
  const data = await fetch("https://randomuser.me/api/?results=10");
  const json = await data.json();
  setUsers(json.results);
};

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