javascript - 组件中的功能未执行

Question

我有一个时间表应用程序的 React 功能组件，用户可以在其中选择时间，然后该应用程序会告诉他们他们那一周的总工作时间。在我的组件中，我有一个函数，它接受一系列值并将它们加在一起以获得每周总工作时数。

我得到一个奇怪的结果，如果我以一种方式组织代码，它可以工作，但是

这个有效:

  const calculateFinalTime = (times) => {
    const totalMinutes = times.reduce((acc, cur) => {
      return typeof cur.resultM === "number" ? (acc += cur.resultM) : acc;
    }, 0);
    const finalHrs = Math.floor(totalMinutes / 60);
    const finalMins = totalMinutes % 60;
    const stringHrs = String("0" + finalHrs).slice(-2);
    const stringMins = String("0" + finalMins).slice(-2);
    const finalTime = `${stringHrs}:${stringMins}`;
    return finalTime;
  };
  console.log(calculateFinalTime(times));

我所说的作品是指我在控制台中获得总和的值

但这不是:

  const [finalTime, setFinalTime] = useState("");

  const calculateFinalTime = (times) => {
    const totalMinutes = times.reduce((acc, cur) => {
      return typeof cur.resultM === "number" ? (acc += cur.resultM) : acc;
    }, 0);
    const finalHrs = Math.floor(totalMinutes / 60);
    const finalMins = totalMinutes % 60;
    const stringHrs = String("0" + finalHrs).slice(-2);
    const stringMins = String("0" + finalMins).slice(-2);
    const finalTime = `${stringHrs}:${stringMins}`;
    setFinalTime(finalTime);
  };

  console.log(finalTime);

出于某种原因，我的控制台中没有显示任何值。如果我尝试在 div 中显示值，它也不起作用。

谁能告诉我为什么？

Answer 1

可能是第二个代码片段没有调用calculateFinalTime，它只是尝试使用finalTime。