Javascript LaterJS+；useEffect多次发出函数调用

我的代码：

useEffect(() => {
    later.setInterval(
      async () => {
        console.log('refreshing...', dayjs().format('HH:mm:ss')); // eslint-disable-line 
        const refreshedCredentials = await refreshSession();
        refreshUserSession(refreshedCredentials);
      },
      later.parse.text('every 25 min'),
    );
  }, []); // eslint-disable-line

.setInterval

应该：

为文本明细表的每次连续出现执行（函数）

换句话说，只要时间匹配，就运行函数。但是，我的函数似乎重新运行了多次：

这会导致不必要的API请求，我担心它会延迟我的应用程序。有什么建议吗

更新：

有问题的文件包装了几个路由器路由（MainLayout）：

同一组件是否有多个实例？还应该返回一个函数，该函数可能会在组件卸载时停止间隔。好问题，这是一个用于多个路由的布局文件。更新代码。目标是包装所有受保护的路由，并使用最顶层的组件运行refreshSession（），特别是为了避免重新渲染。假设它只是一个实例，但要确定调用useEffect（）的频率。我将尝试在laterjs方法之外进行日志记录。同一组件是否有多个实例？还应该返回一个函数，该函数可能会在组件卸载时停止间隔。好问题，这是一个用于多个路由的布局文件。更新代码。目标是包装所有受保护的路由，并使用最顶层的组件运行refreshSession（），特别是为了避免重新渲染。假设它只是一个实例，但要确定调用useEffect（）的频率。我将尝试在laterjs方法之外进行日志记录。

      <MainLayout>
          <Route
            exact
            path="/dashboard"
            component={Dashboard}
          />

          <Route
            exact
            path="/restaurant"
            component={Restaurant}
          />

          <Route
            exact
            path="/reservations"
            component={Reservations}
          />

          <Route
            exact
            path="/dishes"
            component={Dishes}
          />

          <Route
            exact
            path="/dishes/:id"
            component={Dish}
          />
        </MainLayout>