在vue.js項目中，經(jīng)常需要對數(shù)據(jù)實時更新――每隔xx秒需要刷新一次接口――即需要用到定時器相關(guān)原理

我們先看一看2種常用定時器：

setInterval(function(){}, milliseconds)――會不停的調(diào)用函數(shù)setTimeout(function(){}, milliseconds)――只執(zhí)行函數(shù)一次

乍看之下，setInterval會符合我們的業(yè)務(wù)需求，然而也需要注意一些坑，單純的使用setInterval會導致頁面卡死！其原因與JS引擎線程有關(guān)（有興趣的童鞋可自行研究相關(guān)資料），用通俗話說就是setInterval不會清除定時器隊列，每重復執(zhí)行1次都會導致定時器疊加，最終卡死你的網(wǎng)頁。

但是setTimeout是自帶清除定時器的，因此正確解決方法如下：

window.setInterval(() => {  setTimeout(fun, 0)}, 30000)

注意：setInterval必須放在外層（在內(nèi)層會導致頁面卡頓直到崩潰），內(nèi)層配合setTimeout，即可無限次調(diào)用我們的接口啦！

總結(jié)

以上所述是小編給大家介紹的vue項目每30秒刷新1次接口的實現(xiàn)方法，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復大家的。在此也非常感謝大家對武林網(wǎng)網(wǎng)站的支持！