React的useEffect内fetch回调中调用setState报错setData不是函数怎么解决？

错误原因 #

• React 内置的 useState Hook 返回值为长度为2的数组，你使用了对象解构的语法接收返回值，二者类型不匹配
• 错误写法 const {data, setData} = useState([]) 中，你试图从返回的数组里读取data、setData属性，数组本身不存在这两个自定义属性，最终setData被赋值为undefined，调用时就会抛出「不是函数」的报错

修复方案 #

将对象解构替换为数组解构即可，修改状态声明行的代码：

// 原错误写法
// const {data, setData} = useState([]);
// 修改后的正确写法
const [data, setData] = useState([]);

数组解构的第一个元素对应你定义的状态值，第二个元素对应专属的状态更新方法，修改后即可正常调用setData更新状态。

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