html代码就不写了,直接上script中的代码
export default {
data() {
return {
countdown:"",
timer: null,
}
},
methods: {
getMobileCode(){
const TIME_COUNT = 60;
if (!this.timer) {
this.countdown = TIME_COUNT;
this.timer = setInterval(() => {
if (this.countdown > 1 && this.countdown <= TIME_COUNT) {
this.countdown--;
} else {
this.countdown = ''
clearInterval(this.timer);
this.timer = null;
}
}, 1000);
}
},
}
}
以上是编程学习网小编为您介绍的“vuejs封装60秒倒计时”的全面内容,想了解更多关于 vuejs 内容,请继续关注编程基础学习网。
沃梦达教程
本文标题为:vuejs封装60秒倒计时
猜你喜欢
- 基于HTML5+CSS3实现简单的时钟效果 2022-09-16
- Ajax的原生实现关于MIME类型的使用方法 2023-02-15
- React Native学习之Android的返回键BackAndroid详解 2024-01-16
- CSS控制让每行显示4个图片的样式 2024-02-05
- css3与html5实现响应式导航菜单(导航栏)效果分享 2024-01-04
- 关于cookie的初识和运用(js和jq) 2024-02-13
- ASP.NET Core中快速构建PDF文档的步骤分享第2/2页 2024-02-25
- css实现左侧固定右侧自适应的布局方式 2024-02-06
- JS语法也可以有C#的switch表达式 2023-07-09
- ajax三级联动下拉菜单效果 2023-01-31