我在使用React的useState钩子时遇到了一些问题。我有一个待办事项清单,其中包含一个复选框按钮,我希望将具有与“点击”复选框按钮的id相同的id的“完成”属性更新为“true”。如果我在控制台中记录我的“toggleDone”函数,则返回正确的id。但是我不知道如何更新正确的属性。
当前状态:
const App = () => {
const [state, setState] = useState({
todos:
[
{
id: 1,
title: 'take out trash',
done: false
},
{
id: 2,
title: 'wife to dinner',
done: false
},
{
id: 3,
title: 'make react app',
done: false
},
]
})
const toggleDone = (id) => {
console.log(id);
}
return (
<div className="App">
<Todos todos={state.todos} toggleDone={toggleDone}/>
</div>
);
}
我希望的最新状态:
const App = () => {
const [state, setState] = useState({
todos:
[
{
id: 1,
title: 'take out trash',
done: false
},
{
id: 2,
title: 'wife to dinner',
done: false
},
{
id: 3,
title: 'make react app',
done: true // if I checked this checkbox.
},
]
})
setState()
。你尝试过什么了吗?如果有,结果如何?如果你不知道如何开始,可以查看map()
函数。 - Code-ApprenticeuseState
来单独管理不同的状态值。 - Emile Bergeron