vue判断用户在页面停留时间是否超时


需求

当用户停留超过15分钟后,用户提交订单,提示用户超时并重新加载页面

代码

data () {
    return {
        // 超时定时器
        overTimer: null,
        // 是否超时
        isOvertime: false,
    }
},
created () {
    // 开启定时器
    this.overTimer = setTimeout(() => {
      this.isOvertime = true;
    }, 900000)
},
destroyed () {
    // 销毁定时器
    clearTimeout(this.overTimer)
},
methods: {
    submitOrder () {
        // 判定是否超时
        if (this.isOvertime) {
            this.$message.error('订单已过期,请重新下单');
            window.location.reload()
        }
    }
} 

定时器

如果方法还未被执行,可以使用 clearTimeout() 来停止计时器。
如果平时直接用的话,不必清除定时器,clearTimeout是在没执行之前清除定时器

// 设置
setTimeout(function, milliseconds);
// 清除
clearTimeout(id_of_settimeout)

 类似的:

vue 用户停留页面超过30分钟未操作 强制退出到登录页面

https://www.cnblogs.com/fmixue/p/10268660.html

 


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM