vue 15分钟倒计时
HTML:
<span>{{minute}}:{{second}}</span>
script:
一 
二
// 倒计时
num(n) {
return n < 10 ? '0' + n : '' + n
},
timer () {
var _this = this
var time = window.setInterval(function () {
if (_this.seconds === 0 && _this.minutes !== 0) {
_this.seconds = 59
_this.minutes -= 1
} else if (_this.minutes === 0 && _this.seconds === 0) {
_this.seconds = 0
window.clearInterval(time)
} else {
_this.seconds -= 1
}
}, 1000)
}

三 
四
mounted() {
this.timer()
},
watch: {
second: {
handler (newVal) {
this.num(newVal)
}
},
minute: {
handler (newVal) {
this.num(newVal)
}
}

vue 15分钟倒计时的更多相关文章
- vue组件 订单支付15分钟倒计时
//支付倒计时 ComputetTime(data) { let st = data.currentTime.replace(/\-/g, "/"),//当前服务器时间 ct = ...
- Vue 页面15分钟无操作时返回首页
这种需求手机端和pc端一般是不存在的,因为都是可以手动操作刷新的. 最近在做一个户外社区大屏的项目,因为大屏是全屏显示,没法手动刷新,不可能在页面专门做一个刷新按钮,也不好看,那这样的需求就显得格外重 ...
- 15分钟带你了解前端工程师必知的javascript设计模式(附详细思维导图和源码)
15分钟带你了解前端工程师必知的javascript设计模式(附详细思维导图和源码) 前言 设计模式是一个程序员进阶高级的必备技巧,也是评判一个工程师工作经验和能力的试金石.设计模式是程序员多年工作经 ...
- 获取当前时间UTC时间的下一个15分钟时间点
ZonedDateTime zdt = ZonedDateTime.now(ZoneOffset.UTC); int now15Minute = zdt.getMinute() / P15MINUTE ...
- 15分钟学会使用Git和远程代码库
git是个了不起但却复杂的源代码管理系统.它能支持复杂的任务,却因此经常被认为太过复杂而不适用于简单的日常工作.让我们诚实一记吧:Git是复杂的,我们不要装作它不是.但我仍然会试图教会你用(我的)基本 ...
- Bash脚本15分钟进阶教程
转载: Bash脚本15分钟进阶教程 这里的技术技巧最初是来自谷歌的"Testing on the Toilet" (TOTT).这里是一个修订和扩增版本. 脚本安全 我的所有ba ...
- mysql查超过15分钟未付款的订单,更新为失效状态
个人打开自己的订单时,才检查超过15分钟未付款的订单, 暂不使用机器人,更新状态, Difference counter 差分计数器订单超过15分钟.mysql的时间戳差分比较 $sql = TIM ...
- 15分钟理解HTTPS——通俗篇
| 导语 它很深奥吗?你肯定常常见过它,使用它,甚至离不开它... 它很浅显吗?你可能觉得看透它,理解它,甚至懂它... 让我们用15分钟,不那么学术地将它的深挖到底~ 什么?如何证明我是我?本文要上 ...
- 15分钟在笔记本上搭建 Kubernetes + Istio开发环境
11月13~15日,KubeCon 上海大会召开,云原生是这个秋天最火热的技术.很多同学来问如何上手 Kubernetes和Istio 服务网格开发.本文将帮助你利用Docker CE桌面版,15分钟 ...
随机推荐
- rest_framework视图和组件
一.视图 1.基本视图 #基本视图 #抽取基类 from rest_framework.response import Response from rest_framework.views impor ...
- Learning-Python【12】:装饰器
一.什么是装饰器 器:工具 装饰:为被装饰对象添加新功能 装饰器本身可以是任意可调用的对象,即函数 被装饰的对象也可以是任意可调用的对象,也是函数 目标:写一个函数来为另外一个函数添加新功能 二.为何 ...
- “Material Design”设计规范在 ComponentOne For WinForm 的全新尝试!
概述 Material Design设计规范的受欢迎程度和实用性已经引起了 ComponentOne 技术团队的重视.ComponentOne Enterprise 2018V3 版本将全面支持Mat ...
- Spring中 @Autowired标签与 @Resource标签
spring不但支持自己定义的@Autowired注解,还支持由JSR-250规范定义的几个注解,如:@Resource. @PostConstruct及@PreDestroy. @Autowired ...
- 机器学习实战1-1 KNN电影分类遇到的问题
为什么电脑排版效果和手机排版效果不一样~ 目前只学习了python的基础语法,有些东西理解的不透彻,希望能一边看<机器学习实战>,一边加深对python的理解,所以写的内容很浅显,也许还会 ...
- (转)浏览器对象window,history,location,navigator,screen
1.window对象:当前的浏览器窗口 window对象是BOM的核心,window对象指当前的浏览器窗口 所有JavaScript全局对象.函数以及变量均自动成为window对象的成员 全局变量是w ...
- 用docker-compose部署postgres+ postgis
20190411更新.之前写的太啰嗦,也不删了,重新来.小坑还是有的 psql 命令行客户端 因为postgres用docker镜像安装,所以host不需要安装pg,只需要安装客户端 sudo apt ...
- get函数
dict={"name":"jary","age":22}print(dict.get("age")) # 通过键值找到 ...
- 2018 German Collegiate Programming Contest (GCPC 18)
2018 German Collegiate Programming Contest (GCPC 18) Attack on Alpha-Zet 建树,求lca 代码: #include <al ...
- MogonDB安装及配置
1.下载地址:https://www.mongodb.com/download-center/community?jmp=docs 选择下载MSI文件类型 2.双击安装 此处如勾选,则会影响安装速度, ...