Javascript 响应本地社区复选框onValueChange不起作用

我用来允许用户选择主题的@react native community/复选框只调用onValueChange一次。因此，您可以检查它，但不能取消选中它

我通过在每次调用函数时执行console.log来测试这一点，它只打印一次。我还记录了之前和之后的主题状态，它会按预期更改，并且复选框值属性上使用的选定值会更新

我还在不同的屏幕上使用了一个复选框，它工作得很好，所以我认为我没有安装问题

复选框组件：

<>
  <NKCard>
    <Text style={styles.heading}>Module 1</Text>
    {subjects
      .filter(subject => subject.Module === '1')
      .map(subject => {
        return (
          <View key={subject.id} style={styles.subject}>
          <Checkbox
            disabled={subject.disabled}
            value={subject.selected}
            onValueChange={() => {
              handleSubjectSelect(subject.id);
            }}
            tintColors={{true: '#36b254', false: '#36b254'}}
          />
          <Text style={styles.subjectTitle}>{subject.Title}</Text>
        </View>
      );
    })}
  </NKCard>
</>

控制台日志：

[Sun May 24 2020 22:31:55.883]  LOG      change

[Sun May 24 2020 22:31:55.885]  LOG      [{"Grade": "1", "Module": "1", "Status": "active", "Title": "Math", "disabled": false, "id": "15", "selected": 
false}, {"Grade": "1", "Module": "2", "Status": "active", "Title": "Math", "disabled": false, "id": "16", "selected": false}, {"Grade": "1", "Module": "3", "Status": "active", "Title": "Math", "disabled": false, "id": "17", "selected": false}, {"Grade": "1", "Module": "4", "Status": "active", "Title": "Math", "disabled": false, "id": "18", "selected": false}]

[Sun May 24 2020 22:31:55.891]  LOG      update

[Sun May 24 2020 22:31:55.898]  LOG      [{"Grade": "1", "Module": "1", "Status": "active", "Title": "Math", "disabled": false, "id": "15", "selected": 
true}, {"Grade": "1", "Module": "2", "Status": "active", "Title": "Math", "disabled": false, "id": "16", "selected": false}, {"Grade": "1", "Module": "3", "Status": "active", "Title": "Math", "disabled": false, "id": "17", "selected": false}, {"Grade": "1", "Module": "4", "Status": "active", "Title": "Math", "disabled": false, "id": "18", "selected": false}]

我发现了我的错误

我在handleSubjectSelect函数中直接在currentSubjects上更改了对象的选定值。我修复了它，制作了一个新的currentSubjects副本，更改了其中的对象，然后返回newSubjects

解决方案：

const handleSubjectSelect = id => {
  console.log('change');
  setSubjects(currentSubjects => {
    console.log(currentSubjects);

    const newSubjects = [...currentSubjects];

    newSubjects.forEach(subject => {
      if (subject.id === id) {
        subject.selected = !subject.selected;
        console.log('update');
      }
    });
    console.log(newSubjects);

    return newSubjects;
  });
};

---

欢迎收看Stackoverflow Dominic！请不要使用屏幕截图，而是复制/粘贴文本格式的代码、日志等？有关屏幕截图的更多信息，请阅读@jmaitrehenry，我已根据要求对其进行了更改。

const handleSubjectSelect = id => {
  console.log('change');
  setSubjects(currentSubjects => {
    console.log(currentSubjects);

    const newSubjects = [...currentSubjects];

    newSubjects.forEach(subject => {
      if (subject.id === id) {
        subject.selected = !subject.selected;
        console.log('update');
      }
    });
    console.log(newSubjects);

    return newSubjects;
  });
};