思路：跟一般js倒计时一样，主要在于this的变相传递。

实现效果：

wxml文件部分代码：

common.js文件 :

引用页JS文件:

PS:

1.在data里初始化时间格式，是避免时间加载的第1秒显示为空白，因为setTimeOut是在1s以后开始执行。

2.在有setTimeOut的地方最好都匹配一个clearTimeOut，这样可以避免当剩余时间更改后，由于上一个setTimeOut计数还没结束导致的时间交替展示的情况。

微信小程序倒计时实现的更多相关文章

  1. 微信小程序倒计时组件开发

    今天给大家带来微信小程序倒计时组件具体开发步骤: 先来看下最终效果: git源:http://git.oschina.net/dotton/CountDown 分步骤-性子急的朋友,可以直接看最后那段 ...

  2. 微信小程序 倒计时

    这两天在看微信小程序,参考了网上的资料,做了一个倒计时的练习,记录如下. 本文作者:罗兵 原地址:https://www.cnblogs.com/hhh5460/p/9981064.html 0.效果 ...

  3. 微信小程序——倒计时功能

    做小程序项目中,需要做一个倒计时功能,如下图: 记录一下实现步骤: 1.考虑到这个功能可能会有多处用到,所以把倒计时的函数写在utils.js里面: const formatNumber = n =& ...

  4. 微信小程序倒计时

    今天做程序要做个限时抢购的功能如图: 先上代码: 源码 index.wxml    可根据自己实际需求改改 <view class="div-content-warp"> ...

  5. 微信小程序倒计时的方法

    timeOut: function(time) { var that = this; var end = new Date(time).getTime(); var Interval = setInt ...

  6. 微信小程序倒计时实现功能

    onLoad: function () {    var that=this;    this.data.intervarID= setInterval(function () {      var ...

  7. 微信小程序源码推荐

    wx-gesture-lock  微信小程序的手势密码 WXCustomSwitch 微信小程序自定义 Switch 组件模板 WeixinAppBdNovel 微信小程序demo:百度小说搜索 sh ...

  8. 微信小程序案例大全

    微信小程序demo:足球,赛事分析 小程序简易导航 小程序demo:办公审批 小程序Demo:电魔方 小程序demo:借阅伴侣 微信小程序demo:投票 微信小程序demo:健康生活 小程序demo: ...

  9. 微信小程序学习指南

    作者:初雪链接:https://www.zhihu.com/question/50907897/answer/128494332来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业转载请注明 ...

随机推荐

  1. Linux环境下的多线程

    1. 按照POSIX 1003.1c 标准编写的程序与Linuxthread 库相链接即可支持Linux平台上的多线程,在程序中需包含头文件pthread. h,在编译链接时使用命令: gcc -D ...

  2. 关于在MySql的decimal中犯的一个错-此篇文章目的在于警醒自己

    今天在运行一段程序的时候报了Out of range value错误,网上的解释是说这个值与数据库字段类型不匹配,然而程序里面设置的是BigDecimal,数据库设置的是decimal,没有多想就把s ...

  3. 经典算法--冒泡排序（Java）

    原理:将相邻元素的较大值赋给右边 思路:① 1.将集合或数组内的第一个元素与第二个元素进行比较,较大值赋给右边: 2.将第二个元素与第三个元素进行比较,较大值赋给右边: ....... (N-1).将 ...

  4. Properties读取小结

    一.Java程序中读取properties文件 加载的工具类: import java.io.File; import java.io.FileOutputStream; import java.io ...

  5. 20155237 《Java程序设计》实验一（Java开发环境的熟悉）实验报告

    20155237 <Java程序设计>实验一(Java开发环境的熟悉)实验报告 一.实验内容及步骤 使用JDK编译.运行简单的java程序 新建文件夹 打开终端 输入cd Code命令进入 ...

  6. 20155327 2017-2018-2 《Java程序设计》第一周学习总结

    20155327 2017-2018-2 <Java程序设计>第一周学习总结 教材学习内容总结 三大平台: 1.Java SE:JVM,JRE,JDK,java语言 JVM:Java虚拟机 ...

  7. Codeforces Round #511 Div.1 A Div.2 C

    嗯切一题走人很开心. gzy-50分比我还惨. 题意:有n个数,去掉尽量少的数使得剩下数的gcd变大. 首先把这n个数都除以gcd,就变成了去掉尽量少的数使得gcd不等于1. 可以枚举一个质数,然后统 ...

  8. P3164 [CQOI2014]和谐矩阵

    P3164 [CQOI2014]和谐矩阵 乱写能AC,暴力踩标程(雾 第一眼 诶这题能暴力枚举2333!!! 第二眼 诶这题能高斯消元!那只需要把每个位置的数给设出来就能够列方程了!然后就可以\(O( ...

  9. linux 之 jq

    1.安装 mac 安装: brew install jq centos 安装: yum install jq ubuntu: 安装: apt-get install jq 2.使用 cat test. ...

  10. Docker系列之CentOS7安装Docker（一）

    0.前言 整体架构目录:ASP.NET Core分布式项目实战-目录 一.瞎扯淡(只讲有用的) 感兴趣的同学可以上网搜索一下docker具体的介绍.我这边主要介绍偏实战的内容,不喜勿喷,有问题也请指出 ...