vue實(shí)現(xiàn)定時刷新數(shù)據(jù),每隔5分鐘執(zhí)行一次
更新時間:2023年01月16日 09:04:48 作者:~犇犇~
這篇文章主要介紹了vue實(shí)現(xiàn)定時刷新數(shù)據(jù),每隔5分鐘執(zhí)行一次問題,具有很好的參考價值,希望對大家有所幫助。如有錯誤或未考慮完全的地方,望不吝賜教
vue定時刷新數(shù)據(jù),每隔5分鐘執(zhí)行一次
data() { return { timer: null } }, mounted() { // 每隔5分鐘定時刷新 this.timer = setInterval(() => { this.getFxItemlist(); }, 300000) }, beforeDestroy() { clearInterval(this.timer); }, methods: { getFxItemlist() { ... } }
vue局部定時刷新
定時刷新一般都會想到定時器,vue局部定時刷新如下:
設(shè)置定時器
?? ?timer: "",//定時器 ?? ? ?? ?//定時器刷新待辦事項(xiàng) ? ? ?this.timer = setInterval(() => { ? ? ? self.reload(); ? ? }, 1000);
局部刷新
?<div class="DealtTop" v-if="isRefreshAlive"> ? ?isRefreshAlive: true, //刷新 //局部刷新 ? ? reload() { ? ? ? this.isRefreshAlive = false; ? ? ? this.$nextTick(function() { ? ? ? ? this.isRefreshAlive = true; ? ? ? }); ? ? },
如果是在父子組件中,還需要加上provide / inject配合使用,如下:
?provide() { ? ? return { ? ? ? reload: this.reload ? ? }; ? },
清除定時器
destroyed(){ ? ? clearInterval(this.timer); ? },
總結(jié)
以上為個人經(jīng)驗(yàn),希望能給大家一個參考,也希望大家多多支持腳本之家。
相關(guān)文章
Vue動態(tài)設(shè)置el-table操作列的寬度自適應(yīng)
這篇文章主要給大家介紹了關(guān)于Vue如何動態(tài)設(shè)置el-table操作列的寬度自適應(yīng),很多頁面都需要用到表格組件el-table,如果沒有給el-table-column指定寬度,默認(rèn)情況下會平均分配給剩余的列,需要的朋友可以參考下2023-07-07Vue項(xiàng)目打包部署到GitHub Pages的實(shí)現(xiàn)步驟
本文主要介紹了Vue項(xiàng)目打包部署到GitHub Pages的實(shí)現(xiàn)步驟,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2022-04-04vue使用openlayers實(shí)現(xiàn)移動點(diǎn)動畫
這篇文章主要為大家詳細(xì)介紹了vue使用openlayers實(shí)現(xiàn)移動點(diǎn)動畫,文中示例代碼介紹的非常詳細(xì),具有一定的參考價值,感興趣的小伙伴們可以參考一下2020-09-09Vue中實(shí)現(xiàn)動態(tài)右鍵菜單的示例代碼
在前端開發(fā)中,實(shí)現(xiàn)自定義右鍵菜單能夠?yàn)橛脩籼峁└喙δ苓x項(xiàng),本文就來介紹了Vue中實(shí)現(xiàn)動態(tài)右鍵菜單的示例代碼,感興趣的可以了解一下2024-11-11Vant的安裝和配合引入Vue.js項(xiàng)目里的方法步驟
這篇文章主要介紹了Vant的安裝和配合引入Vue.js項(xiàng)目里的方法步驟,小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2018-12-12