首页 > 解决方案 > 如何使用 fetch() 获得的 vanilla JS 每 x 秒更新一次信息?

问题描述

我有一些通过 fetch() 收到的信息,并且这些信息保持在通话时的状态。原始 json 每 10 秒更新一次,我想通过每 10 秒更新一次 fetch 来利用这一点。我怎么做?

我的代码是:


   fetch('https://api.nomics.com/v1/currencies/ticker?key=my_key&ids=BTC,ETH,XRP&interval=1d,30d&convert=USD&per-page=100&page=1')
            .then(function (response) { return response.json(); })
            .then(function (data) { appendData(data); });
    
    
        function appendData(data) {
            document.getElementById('pikcs').src = data[2].logo_url;
            var mainContainer = document.getElementById("ideir");
            for (var i = 0; i < data.length; i++) {
                var div = document.createElement("div");
                div.innerHTML = data[i].id + " " + data[i].name + "<br> $" + data[i].price; div.style.paddingRight = "50px";
                var imzs = document.createElement("img");
                imzs.src = data[i].logo_url; imzs.style.height = "40px";
                
                mainContainer.appendChild(imzs);
                mainContainer.appendChild(div);
            }

标签: javascriptjsonfetch

解决方案


您可以使用setInterval()

 const interval = setInterval(function() {
       fetch('https://api.nomics.com/v1/currencies/ticker?key=my_key&ids=BTC,ETH,XRP&interval=1d,30d&convert=USD&per-page=100&page=1')
            .then(function (response) { return response.json(); })
            .then(function (data) { appendData(data); });
     }, 1000); //1000 means 1 sec, 5000 means 5 seconds

推荐阅读