需求：项目中我们经常需要实现轮询-每隔几秒请求一次接口刷新数据

第一部分：在html页面解决方案

//js两种定时器
setInterval(function(){}, 间隔时间)——会不停的调用函数
setTimeout(function(){}, 间隔时间)——只执行函数一次

解决方法如下：

window.setInterval(() => {
  setTimeout(()=>{调用}, 0)
}, 1000)
解释：setInterval不会清除定时器队列，每重复执行1次都会导致定时器叠加，最终卡死你的网页。
但是setTimeout是自带清除定时器的

 第二部分：在vue中的解决方

// 需求：实时获取接口数据，每隔一秒钟获取一次，我们可以通过定时刷新页面来达到效果

// js两种定时器
// setInterval(function(){}, 间隔时间)——会不停的调用函数

// setTimeout(function(){}, 间隔时间)——只执行函数一次
import axios from "axios";
export default {
 data(){
   return {
     timer:null
   }
 },
 mounted(){
   // 页面加载后
   // 1.在执行定时器前先执行一次获取接口数据的操作函数, 否则接口会1秒钟后才调用
   // 2.为了避免退出当前页面后,在其他页面也继续调用接口,退出前需要清除定时器.
   this.queryInfo()
   this.timer = setInterval(() => {
       setTimeout(this.queryInfo, 0)
   }, 1000)
 },

 methods: {
   queryInfo(){
     axios({
       url:'https://autumnfish.cn/api/joke',
       method:'get',
     }).then(res=>{
       //成功回调
       console.log(res)
     })
   
   }
    
 },
 beforeDestroy(){
   clearInterval(this.timer);        
   this.timer = null;
 }