前端实现倒计时

浏览器缓存被清除的情况不符合这种情况

HTML：

 

 

created() {

    if (localStorage.getItem("lockTime")) {

      console.log(typeof localStorage.getItem("lockTime"));

      let surplus =

        (new Date().valueOf() - Number(localStorage.getItem("lockTime"))) / 1000;

      console.log(surplus, Number(localStorage.getItem("lockTime")));

      if (0 < surplus < 300) {

        let shengyu = 300 - surplus;

        this.disabled = true;

        this.clock(shengyu);

      }

    }

}

 methods: {

    lockTime(times) {

      let date = new Date().valueOf();

      localStorage.setItem("lockTime", date);

      this.disabled = true;

      this.clock(times);

    },

    // 登录被锁定倒计时方法

    clock(times) {

      var _this = this;

      //计算分钟

      var fen = parseInt((times % 3600) / 60);

      //计算秒

      var miao = parseInt((times % 3600) % 60);

      //写入页面显示

      _this.denglu = "账号锁定倒计时:" + fen + "分" + miao + "秒";

      if (times > 0) {

        //倒计时的秒数递减1

        times = times - 1;

        //定时1秒，然后调用自身clock方法

        //每次递减1，不停调用自身，实现循环，直到times=0

        setTimeout(function () {

          _this.clock(times);

        }, 1000);

      } else {

        this.disabled = false;

        document.getElementById("clock").innerHTML = "登录";

        localStorage.removeItem("lockTime");

      }

    },

}

借鉴于：JS实现倒计时功能