页面首次访问时Checkbox首次点击无法取消勾选的问题求助

问题根源 #

初始状态下reminder.pushNotificationEnabled为null，当前代码通过checked={reminder.pushNotificationEnabled ?? true}让Checkbox默认处于勾选状态。但点击时直接传递reminder.pushNotificationEnabled（即null）给回调函数，导致后续状态更新逻辑出错，无法正确反转勾选状态。

修复方案 #

我们需要基于Checkbox的实际显示状态来切换值，而不是直接使用原始的pushNotificationEnabled值：

// 先计算当前Checkbox实际的勾选状态
const isChecked = reminder.pushNotificationEnabled ?? true;

const onNotificationToggle = (notificationReminder) => {
    onDateChange(toDate(dateToUse));
    callbackNotification(notificationReminder, reminder.reminderType);
};

<Checkbox
  checked={isChecked}
  ...
  onPress={() => onNotificationToggle(!isChecked)}
/>

修复逻辑说明 #

1. 初始时isChecked为true（因为pushNotificationEnabled是null），点击后传递!isChecked（即false）给回调，让pushNotificationEnabled被设置为false，Checkbox变为未勾选。
2. 后续每次点击都会基于当前的isChecked值反转，确保状态切换完全符合用户操作预期。

内容的提问来源于stack exchange，提问作者Bomber