在函数中使用设置间隔和获取

问题描述 投票:0回答:4

创建一个函数

startShowingMessage
,它接受两个参数:一个元素和一个 URL 字符串。该函数将使用
setInterval
每 1 秒执行以下任务:获取 URL 并将响应文本放入所提供元素的文本内容中。

我制作了该函数并且获取有效,但我不知道如何在同一函数中设置间隔,而不必调用另一个函数。

async function startShowingMessage(elem, url){
  const response = await fetch(url);
  const text = await response.text();
  elem.textContent = text;
}

由于没有间隔,这些功能只能部分工作。

javascript setinterval fetch-api
4个回答
4
投票

您可以根据您的需要使用

setInterval

function startShowingMessage(elem, url){
  setInterval(async function(){
    const response = await fetch(url);
    const text = await response.text();
    elem.textContent = text;
  }, 1000);     
}

如果您想了解更多信息这里是 W3Schools

或者可以按照 3limin4t0r 的建议在 MDN 文档 找到官方文档


2
投票

每 1 秒调用一次该函数:

setInterval(startShowingMessage, 1000);

2
投票

function startShowingMessage(elem, url) {
  setInterval(async () => {
    const response = await fetch(url).then(response => response.json())
    
    elem.textContent = response.message
  }, 1000)
}


0
投票

这是另一种方法,它使用动画帧纪元匹配,而不是

setInterval

我们正在寻找这种更新界面的方法,因为它考虑了设备性能,并且可能避免造成冻结和内存泄漏。

enter image description here

/* Timer loop ----------------------------------------*/
let job, origin = new Date().getTime(), i = 0;
const timer = () => {
  if (new Date().getTime() - i > origin){
   i = i + 2000
   fetch("XXXX")
   .then(response => response.json())
   .then(j => {
     // Parse response
   })


   job = requestAnimationFrame(timer)
  } else if (job !== null){
      requestAnimationFrame(timer)    
  }
}

/* Start looping or start again ------------------------*/
requestAnimationFrame(timer)
// Stop the loop
// job = null

最新问题
© www.soinside.com 2019 - 2025. All rights reserved.