很多二维码都需要设置过期时间,比如扫码登录、付款二维码等。下面编程教程网小编给大家详细介绍一下实现代码!
具体代码如下:
export default {
name: "qrCode",
data() {
return {
codeStatus: 1, // 1- 未扫码 2-扫码通过 3-过期
effectiveTime: 30, // 有效时间
qrCodeTimer: null // 有效时长计时器
uid: '',
time: ''
};
},
methods: {
// 轮询获取二维码状态
getQcodeStatus() {
if(!this.qsCodeTimer) {
this.qrCodeTimer = setInterval(()=> {
// 二维码过期
if(this.effectiveTime <=0) {
this.codeStatus = 3
clearInterval(this.qsCodeTimer)
this.qsCodeTimer = null
return
}
this.effectiveTime--
}, 1000)
}
},
// 刷新二维码
refreshCode() {
this.codeStatus = 1
this.effectiveTime = 30
this.qsCodeTimer = null
this.generateORCode()
}
},
以上是编程学习网小编为您介绍的“如何设置二维码的时效性?(设置过期时间)”的全面内容,想了解更多关于 vuejs 内容,请继续关注编程基础学习网。
编程基础网
本文标题为:如何设置二维码的时效性?(设置过期时间)
基础教程推荐
猜你喜欢
- Ajax解决缓存的5种方法总结(推荐) 2023-01-26
- elementUI起步按需引用配置(vue+npm) 2023-10-08
- JS获取当前网页大小以及屏幕分辨率等 2023-12-01
- jQuery 顶部导航跟随滚动条滚动固定浮动在顶部 2024-01-17
- JavaScript编写推箱子游戏 2023-12-28
- 获取元素位置的position()与offset()方法区别介绍 2024-03-09
- 使用CSS计数器美化数字有序列表的实现方法 2024-01-16
- JavaScript不刷新实现浏览器的前进后退功能 2023-12-13
- 简单的邮箱登陆的提示效果类似于yahoo邮箱 2023-12-14
- js中的window.open返回object的错误的解决方法 2023-12-15
