基于数组ReactJS自动选中复选框

Question

新手在这里反应我可以请求你的帮助下面?

如何根据Array的结果填充选中/未选中的复选框

我想显示allSystems复选框与ID 1,3=选中和ID 2=未选中在模式弹出编辑

我尝试了下面的代码，但没有运气，它只显示3个复选框(allSystem)，但没有基于(selectedSystem)的复选框

const [allSystems, setallSystems] = useState([]); // List of systems ex [{ID: 1, SYSTEM: "SYSTEM1"},{ID: 2, SYSTEM: "SYSTEM2"},{ID: 3, SYSTEM: "SYSTEM3"}]
const [selectedSystem, setselectedSystem] = useState([]); //List of selected IDs from allSystems ex ["1","3"]
{
allSystems.map((val, i) => {
return(
<FormControlLabel 
key={i}
control={
<Checkbox 
name={val.ID}
color = 'primary'
value = {val.ID}
checked={selectedSystem.includes(val.ID)} //also tried checked={selectedSystem.includes(String(val.ID))}
onChange={handleSingleCheckAffectedSystem}
/>
}
label = {val.DEP_ALIAS}
/>
)
})} 

希望你能理解

Answer 1

checked={selectedSystem.includes(String(val.ID))}