• react中简单倒计时跳转


    其实在react中实现倒计时的跳转方法有很多中,其中我认为较为好用的就是通过定时器更改state中的时间值。

    首先在constructor中设置10秒的时间值:

    constructor () {
        super()
        this.state={
          seconds: 10,
        };
      }
    

    然后在componentDidMount中添加定时器:

    componentDidMount () {
      let timer = setInterval(() => {
        this.setState((preState) =>({
          seconds: preState.seconds - 1,
        }),() => {
          if(this.state.seconds == 0){
            clearInterval(timer);
          }
        });
      }, 1000)
    }

    然后在render中添加判断跳转

    if (this.state.seconds === 0) {
        window.location.href='http://www.cnblogs.com/a-cat/';
    }
    

    这种就可以完成倒计时跳转了!

  • 相关阅读:
    day 1 认识js
    day2,request对象
    day3
    day 14 函数的嵌套,作用域
    命名空间(名称空间)
    day 13 函数
    day 11(2) 集合
    day 11 字典拆包
    字典
    两周英语函数(记)
  • 原文地址:https://www.cnblogs.com/a-cat/p/9607980.html
Copyright © 2020-2023  润新知