React Native：未选中的复选框问题答案

【问题标题】：React Native: Unchecked checbox issueReact Native：未选中的复选框问题
【发布时间】：2022-09-29 22:55:57
【问题描述】：

我有一个有多个复选框的应用程序。我使用react native bouncy checkbox 包。结果，根据复选框项目的状态，我需要一个属性具有布尔值的对象，例如：

{
   \"first question\": true,
   \"second question\": false
}

如果用户选中复选框项目，那么对象属性的值应该是true。如果未选中复选框项目，则对象属性的值应为false。

但是，我有一个问题，如果用户选中复选框项目，然后在提交之前取消选中它，未选中的项目也会返回true。简而言之，如果复选框项目被选中一次，它总是有true 作为值。如何控制这些多个复选框项目是否选中或未选中，最后如何创建如上所述的对象？

const [itemChecked, setItemChecked] = useState({})

const handleChecklist = (item) =>
    setItemChecked({
        ...itemChecked,
        [item.item_text]: !setItemChecked[item.item_text],
    });

{
   checklistItems?.map((item, index) => { return 
        <View key={index}>
           {
             <BouncyCheckbox text={item.item_text}
                             key={item.id}
                             onPress={() => handleChecklist(item)} />
           }
        </View>
   })
}

标签： react-native checkbox

【解决方案1】：

我认为您应该按照here 的描述使用功能状态更新，因为您的状态取决于先前的值。

所以你的更新功能看起来像这样

setItemChecked((prevState) => ({
  ...prevState,
  [item.item_text]: !setItemChecked[item.item_text],
}));

【讨论】：