Javascript 从间隔内更改设置间隔计时

我想根据页面在浏览器中是否处于活动状态来更新页面上的数据。这只适用于针对

document.hasFocus（）

的if查询

但我现在还想知道的是，当焦点回到页面时，更新会立即发生，或者至少在5秒内发生，然后通常在30秒后再次发生

我现在的想法是在间歇时间内改变间歇时间。然而，我一直未能做到这一点

useffect（（）=>{
const statusRefreshInterval=setInterval（（）=>{
if（document.hasFocus（））{
log（“hasFocus:，new Date（）.toLocaleTimeString（））；
设置间隔（状态刷新间隔，30000）；
}否则{
log（“hasNoFocus:，new Date（）.toLocaleTimeString（））；
设置间隔（状态刷新间隔，5000）；
}
}, 30000);
return（）=>clearInterval（statusRefreshInterval）；
}, []);

编辑： 这样，我就满足了我的所有要求：

var lastUpdate=useRef（）；//需要在useEffect中使用变量
const allowedUpdatesAfterSec=300；
useffect（（）=>{
//初始更新
lastUpdate.current=Date.now（）/1000；
//当网站再次获得关注时更新
addEventListener（“焦点”，函数（）{
如果（Date.now（）/1000-lastUpdate.current>allowedUpdatesAfterSec）{
log（“EventListenerUpdate:”，new Date（）.toLocaleTimeString（））；
lastUpdate.current=Date.now（）/1000；
}
});
//当网站处于活动状态时，更新每一个allowedUpdatesAfterSec
const updateRefreshInterval=setInterval（（）=>{
如果（Date.now（）/1000-lastUpdate.current>allowedUpdatesAfterSec）{
if（document.hasFocus（））{
log（“IntervalueUpdate:，new Date（）.toLocaleTimeString（））；
lastUpdate.current=Date.now（）/1000；
}
}
}, 60000);
return（）=>clearInterval（updateRefreshInterval）；
}, []);

---

我会考虑切换到SETTIMEOUT而不是SETIFACTION。

< P>您可以从<代码> > StimeTimeOuts< /Cult>回调中调用<代码> SETTIMEOUT/<代码>动态时间，例如-

让timeToCall=1000
让秒数=Date.now（）/1000
函数dynamicTimeoutFunction（）{
log（`I在${Date.now（）/1000-seconds}seconds`之后被调用）
timeToCall+=1000
setTimeout（dynamicTimeoutFunction、timeToCall）
}
setTimeout（dynamicTimeoutFunction，timeToCall）

由于您是从setInterval中调用setInterval，因此，通过这种方式创建更多的间隔。我只需将setInterval更改为setTimeout

  useEffect(() => {
    const statusRefreshInterval = setTimeout(() => {
      if (document.hasFocus()) {
        console.log("hasFocus:", new Date().toLocaleTimeString());
        setTimeout(statusRefreshInterval, 30000);
      } else {
        console.log("hasNoFocus:", new Date().toLocaleTimeString());
        setTimeout(statusRefreshInterval, 5000);
      }
    }, 30000);
    return () => clearTimeout(statusRefreshInterval);
  }, []);

---

这样，您就可以为下一次通话设置新的时间。

您的意思是在“间隔时间”内更改间隔，还是在下一次间隔之前使用新值更改间隔？每个都有硬编码的值，但您希望/需要的可能是一个参数？“焦点回到页面”一个焦点事件不会冒泡，所以也许你需要为那个事件添加一个事件处理程序，然后处理我考虑使用SETTIMEOUT而不是运行堆叠设置间隔的风险-只是为了安全起见。