ReactJs useState set array of objects

Question

我使用 use State 的反应功能组件。我正在尝试更新对象中的数组，但它没有更新。下面是我的状态

const [prodImg, setProdImg] = useState({
show : false,
url : '',
title : '',
imgList : []
})

我想通过一个函数来更新imgList，该函数接收如下所示的对象数组。

const setImage = ({ fileList }) => {
setProdImg(
{
...prodImg,
imgList: fileList
},
console.log(prodImg.imgList)
)
}

这里fileList是一个解构的对象数组。但是prodImg.imgList没有更新 文件列表包含这样的结构：

[
{
name : 'asc.jpg',
},
{
name : 'aqwe.jpg',
}
]

Answer 1

React 可能会异步更新状态。在您的代码中，您只需写入控制台 imgList 当前状态，该状态保存在堆栈中，但状态实际上是在将其写入控制台后更新的。尝试在效果钩子中记录状态：

const [prodImg, setProdImg] = useState({
show : false,
url : '',
title : '',
imgList : []
}) 
// this callback will be invoked on the component update, eg when state is changed.
useEffect(() => {
console.log(prodImg.imgList)
});