定时刷新页面或请求接口

1. 需求:

   由于数据计算量比较大，所以接口请求返回数据可能会比较慢，这时候咋整勒。为了提高用户体验，想到了前端定时刷新，定时器走起～

2. 定时请求接口

　　a. 先定义个全局的定时器，取名timer

　　b.

// 组件卸载时清空定时器 
componentWillUnmount() {
    clearInterval(this.timer)
  }


timedRefresh = () => {
    clearInterval(this.timer)
    if ( 我是条件 ) {
      this.timer = setInterval(() => {
        fetchSomething(params1, params2)  // 每隔3s请求一次接口
      }, 3000)
    } else {
      clearInterval(this.timer)    // 取消定时器
    }
  }

 

　　

3. 定时刷新页面

　　a. 先定义个全局的定时器，取名timer

　　b.

// 组件卸载时清空定时器 
componentWillUnmount() {
    clearInterval(this.timer)
  }


timedRefresh = () => {
    clearInterval(this.timer)
    if ( 我是条件 ) {
      this.timer = setInterval(() => {
        window.location.reload()    // 每隔3s刷新整个页面
      }, 3000)
    } else {
      clearInterval(this.timer)    // 取消定时器
    }
  }

 

转载于:https://www.cnblogs.com/aloehui/p/9685223.html