我有一个奇怪的情况。我有下面的代码无法正常工作。
const [result, setResult] = useState(props.fileNamesStatus.map((file, i) => {
return {
key: file.fileStatus
}
}));
但是奇怪的是,它有时可以工作,有时却不能。我在JSX
中使用了它,如下所示:
我收到错误
Cannot read property 'key' of undefined
<ul className="in">
{props.fileNamesStatus.map((file, i) => {
console.log(result[i].key) /// Cannot read property 'key' of undefined
})}
</ul>
答案 0 :(得分:1)
您需要添加另一个useEffect挂钩:
useEffect(() => {
if (props.fileNamesStatus && props.fileNamesStatus.length) {
setResult(props.fileNamesStatus.map((file, i) => {
return {
key: file.fileStatus
}
}))
}
}, [props.fileNamesStatus])
但是即使进行了此更改,您的渲染道具和状态仍有可能不同步,因此您应该添加其他检查console.log(result[i] ? result[i].key : 'out of sync')