思路：跟一般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. Scala_Trait特征

    1,scala提供的“特征”可以同时拥有抽象方法和具体方法,一个类可以拥有多个特质 2,类可以通过“extends”关键字继承trait,继承trait后必须实现trait中的所有抽象方法,而不是用 ...

  2. 关于Modelsim SE软件Fatal License Error的解决方法

    操作环境:Win7 32位系统 软件版本:Modelsim SE 10.1a Modelsim SE软件有时会弹出如图1所示“Fatal License Error”的提示信息,原因可能是软件破解不彻 ...

  3. 20155213 《网络攻防》 Exp1 PC平台逆向破解

    20155213 <网络攻防> Exp1 PC平台逆向破解(5)M 实践内容 通过对实践对象--pwn20155213的linux可执行文件的修改或输入,完成以下三块: 手工修改可执行文件 ...

  4. 会话控制（session和cookie）、跨页面传值

    1.session  登录上一个页面以后,长时间没有操作,刷新页面以后需要重新登录. 特点:(1)session是存储在服务器:   (2)session每个人(登陆者)存一份: (3)session ...

  5. 【BZOJ1018】[SHOI2008]堵塞的交通

    [BZOJ1018][SHOI2008]堵塞的交通 题面 bzoj 洛谷 洛谷 题解 菊队讲要用线段树维护连通性,但是好像没人写 解法一 将所有的加边删边离线,然后以最近删除时间为边权,$LCT$维护 ...

  6. SpringCloud-客户端的负载均衡Ribbon（三）

    前言:微服务架构,不可避免的存在单个微服务有多个实例,那么客户端如何将请求分摊到多个微服务的实例上呢?这里我们就需要使用负载均衡了 一.Ribbon简介 Ribbon是Netflix发布的负载均衡器, ...

  7. jmeter测试java代码

    有时候总是要写代码的,不得不说你也得会,这不往下看 java请求了,就的写代码,那么先来实现一个类, package com.company.jemeters; public class Hello ...

  8. 《javascript语言精粹》mindmap

    最近刚刚读完<javascript语言精粹>,感觉其中的内容确实给用js作开发语言的童鞋们提了个醒——js里面坑很多啊 不过,我也并不完全认同书中所讲的所有内容,有些书中认为是糟粕的特性, ...

  9. Macaca上手体验

    在研究了一段时间Appium后,尝试对另一个框架做实验——Macaca,阿里的开源测试框架,该框架不只适合移动端,同样适用于web端,可谓是方便的很啊~ 同时支持js.java.python.封装好的 ...

  10. 详解华为云基因容器服务GCS

    基因测序,作为“下一个能够改变世界”的技术,已经由实验室研究演变到临床使用,为人类预测罹患多种疾病的可能性,提前预防和治疗疾病提供了一套可靠的方法和手段.而基于基因测序在预防和治疗疾病方面的准确和可靠 ...