很多二维码都需要设置过期时间,比如扫码登录、付款二维码等。下面编程教程网小编给大家详细介绍一下实现代码!
具体代码如下:
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 内容,请继续关注编程基础学习网。
沃梦达教程
本文标题为:如何设置二维码的时效性?(设置过期时间)


猜你喜欢
- CSS3 clip-path 用法介绍详解 2024-01-03
- CSS重要属性之float学习心得(分享) 2024-02-07
- 利用HTML+CSS实现跟踪鼠标移动功能 2024-01-05
- php – 从数据库生成静态HTML文件 2023-10-26
- 使用JavaScript实现简单图像放大镜效果 2022-08-30
- BootStrap栅格系统、表单样式与按钮样式源码解析 2024-01-02
- 利用ajax提交form表单到数据库详解(无刷新) 2023-02-15
- jQuery操作元素css样式的三种方法 2024-03-11
- JS与CSS3实现图片响应鼠标移动放大效果示例 2024-01-02
- 将编码从GB2312转成UTF-8的方法汇总(从前台、程序、数据库) 2023-12-02