前端大屏上数据随机变化一会在显示真实值

您可以通过定时器来实现前端大屏上数据随机变化一会再显示真实值的效果。

具体来说，您可以先在前端页面上显示一个随机数，然后通过定时器定时更新这个随机数。当定时器触发时，您可以通过 AJAX 请求获取真实的数据，并将其显示在前端页面上。

以下是一个示例代码：

// 显示随机数
function showRandomNumber() {
  const randomNumber = Math.floor(Math.random() * 100);
  document.getElementById('randomNumber').innerText = randomNumber;
}

// 模拟获取真实数据
function getRealData() {
  return new Promise((resolve) => {
    setTimeout(() => {
      const realData = 50; // 假设真实数据为 50
      resolve(realData);
    }, 2000); // 假设请求延时 2 秒
  });
}

// 定时器定时更新随机数并显示真实数据
setInterval(async () => {
  showRandomNumber();
  const realData = await getRealData();
  document.getElementById('realData').innerText = realData;
}, 5000); // 假设每隔 5 秒更新一次数据

在上面的代码中，我使用了一个定时器，每隔 5 秒更新一次数据。在更新数据时，我先显示一个随机数，然后通过 AJAX 请求获取真实的数据，并将其显示在前端页面上。由于请求需要延时 2 秒，因此显示的随机数会在 2 秒内随机变化，然后才会显示真实数据。