vue項目每30秒刷新1次接口的實現(xiàn)方法
更新時間：2018年12月04日 11:20:04 作者：前端小謳
在vue.js項目中，經(jīng)常需要對數(shù)據(jù)實時更新——每隔xx秒需要刷新一次接口——即需要用到定時器相關(guān)原理。這篇文章主要介紹了vue項目每30秒刷新1次接口的實現(xiàn)方法,需要的朋友可以參考下
在vue.js項目中，經(jīng)常需要對數(shù)據(jù)實時更新——每隔xx秒需要刷新一次接口——即需要用到定時器相關(guān)原理
我們先看一看2種常用定時器：
setInterval(function(){}, milliseconds)——會不停的調(diào)用函數(shù)
setTimeout(function(){}, milliseconds)——只執(zhí)行函數(shù)一次
乍看之下，setInterval會符合我們的業(yè)務需求，然而也需要注意一些坑，單純的使用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)站的支持！
相關(guān)文章
用v-html解決Vue.js渲染中html標簽不被解析的問題
這篇文章主要給大家介紹了如何利用v-html解決Vue.js渲染過程中html標簽不能被解析，html標簽顯示為字符串的問題，文中通過圖文介紹的很詳細，有需要的朋友們可以參考借鑒，下面來一起看看吧。2016-12-12
這篇文章主要為大家詳細介紹了Vue圖片放大鏡組件的封裝，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2021-08-08
這篇文章主要介紹了Vue中的ESLint配置方式，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-03-03
如何使用Vue3實現(xiàn)文章內(nèi)容中多個"關(guān)鍵詞"標記高亮顯示
高亮顯示是我們?nèi)粘ｉ_發(fā)中經(jīng)常會遇到的需求,下面這篇文章主要給大家介紹了關(guān)于如何使用Vue3實現(xiàn)文章內(nèi)容中多個"關(guān)鍵詞"標記高亮顯示的相關(guān)資料,文中通過實例代碼介紹的非常詳細,需要的朋友可以參考下2022-11-11
vue動態(tài)生成新表單并且添加驗證校驗規(guī)則方式
這篇文章主要介紹了vue動態(tài)生成新表單并且添加驗證校驗規(guī)則方式，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-10-10
解決vue net :ERR_CONNECTION_REFUSED報錯問題
這篇文章主要介紹了解決vue net :ERR_CONNECTION_REFUSED報錯問題，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2020-08-08
vue-music關(guān)于Player播放器組件詳解
這篇文章主要為大家詳細介紹了vue-music關(guān)于Player播放器組件的相關(guān)資料，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-11-11
VUE中setTimeout和setInterval自動銷毀案例
這篇文章主要介紹了VUE中setTimeout和setInterval自動銷毀案例，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2020-09-09
element自定義 多文件上傳 觸發(fā)多次on-change問題
這篇文章主要介紹了element自定義 多文件上傳 觸發(fā)多次on-change問題，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2023-03-03
今天小編就為大家分享一篇vue 2.1.3 實時顯示當前時間,每秒更新的方法，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2018-09-09