Javascript React挂钩-重新渲染过多

我对javascript和react钩子都很陌生，我经常会遇到以下代码中的“太多重新渲染”错误

const [showReminder, setShowReminder] = useState(
    lastDismissedDate.diff(overrideDate, 'days') >= 0,
  );

  if (latestIndexScore && !hasCompletedIndexRecently(latestIndexScore.date)) {
    setShowReminder(true);
  }

有没有办法把这两个陈述合并成一个呢。差不多

const [showReminder, setShowReminder] = useState(
    latestIndexScore && !hasCompletedIndexRecently(latestIndexScore.date) || lastDismissedDate.diff(overrideDate, 'days') >= 0,
  );

在上述代码中，条件为true 然后，设置显示提醒将运行或更改其状态 在“反应”中，如果状态更改，它将再次渲染 因此，代码将再次运行（if语句），然后设置值提醒将再次运行，它将再次更改状态。。。。这会导致太多的重新渲染

尝试使用useEffect挂钩，并将数组作为第二个参数传递给useEffect，如下所示

            const [showReminder, setShowReminder] = useState(false);

            useEffect(() => {
               setShowReminder(!showReminder);
            }, [toggle]); // Only re-run the effect if toggle changes

---

如果状态只能从其他变量派生，为什么要使用它？比如

const showmememployer=latestIndexScore&&！hasCompletedIndexRecently（latestIndexScore.date）| | lastDismissedDate.diff（overrideDate，'days'）>=0

或类似的值如果在每次渲染时都调用setShowReminder（true），请检查您的条件。@RamKrish2079我使用的是状态，因为单击提醒按钮时，不应使用setShowReminder（false）显示提醒；那么您的第二种方法应该可以很好地工作

            const [showReminder, setShowReminder] = useState(false);

            useEffect(() => {
               setShowReminder(!showReminder);
            }, [toggle]); // Only re-run the effect if toggle changes