ReactJS，使用处理程序更新状态但数据为空
我有这种情况：
我想更新一些用于映射不同 React 组件的状态（一个数组）。
这些组件有自己的handleUpdate。
但是当我调用handleUpdate时，我需要使用的状态是空的。我认为是因为每个处理程序方法都是在状态填充数据之前挂载的，但是那么，我如何确保或使用处理程序中的数据呢？换句话说，处理程序需要更新填充其自身状态的状态：
const [data, setData] = useState([]);
const [deliver, setDeliver] = useState({items: []});
const handleUpdate = (value, position) => {
// This set works
setDeliver({
items: newItems
});
// This doesn't work because "data" is an empty array - CRASH
setData(data[position] = value);
};
useEffect(() => {
const dataWithComponent = originalData.map((item, i) => ({
...item,
entregado: <SelectorComponent
value={deliver?.items[i].delivered}
key={i}
onUpdate={(value) => handleUpdate(value, i)}
/>
}));
setData(dataWithComponent); // This is set after <SelectComponent is created...
}
}, [originalData]);
I have this situation:
I want to update some state (an array) which is used to map different React components.
Those componentes, have their own handleUpdate.
But when I call to handleUpdate the state that I need to use is empty. I think is because each handler method was mounted before the state was filled with data, but then, how could I ensure or use the data in the handler? In other words, the handler needs to update the state that fill it's own state:
const [data, setData] = useState([]);
const [deliver, setDeliver] = useState({items: []});
const handleUpdate = (value, position) => {
// This set works
setDeliver({
items: newItems
});
// This doesn't work because "data" is an empty array - CRASH
setData(data[position] = value);
};
useEffect(() => {
const dataWithComponent = originalData.map((item, i) => ({
...item,
entregado: <SelectorComponent
value={deliver?.items[i].delivered}
key={i}
onUpdate={(value) => handleUpdate(value, i)}
/>
}));
setData(dataWithComponent); // This is set after <SelectComponent is created...
}
}, [originalData]);
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
您传递的值不是来自
originalData，因此onUpdated不知道它是什么value您使用map在originalData上运行，因此您需要传递item。 onUpdate 函数
The value that you pass don't come from
originalData, so the onUpdated don't know what it'svalueYou run on originalData using map, so you need to pass item.somthing the the onUpdate function
我不确定，但是我认为您可以做这样的事情。希望您能有所了解。
I'm not sure, but I think you can do something like that. I hope you get some idea to work it.