setInterval中的函数先执行一次再等待

最近项目里面有个需求,需要一登录就开始查询提醒列表,此外还需要之后每隔1分钟再请求一次,并刷新提醒,如下图
setInterval中的函数先执行一次再等待_第1张图片
大概思路就是
1.在created里面调用 获取提醒列表的方法getRingListFun
2.定义一个定时器函数getListFun每隔60s调用getRingListFun,也在created直接调用
3.最后,在退出时销毁定时器

上代码

created(){
    this.getRingListFun()
    this.getListFun()
}
methods:{
    getRingListFun(){
        getRingList().then(r=>{
          console.log(r);
          this.ringList = r.data || []
          this.ringLength = r.data.length
      })
    },
    getListFun(){
      this.timer = setInterval(()=>{
        this.getRingListFun()
      },60000)
    },
}

最后,退出登录时记得销毁定时器,否则会报错

clearInterval(this.timer)

你可能感兴趣的:(vue,前端,定时任务)