功能: 适用于电商应用的限时团购、商品秒杀等
先来看下最终效果：
文章插图
分步骤-性子急的朋友 ， 可以直接看最后那段代码 。
wxml文件放个text
second: {{second}} micro second:{{micro_second}}
在js文件中调用
文章插图
运行验证下 ， 从10走到1s ， 然后显示时间到 。
于是继续将毫秒完善 ， 注意毫秒的步长受限于系统的时间频率 ， 于是我们精确到0.01s即10ms
js
文章插图
wxml文件
文章插图
如此 ， 当秒级运行完毕时 ， 毫秒级timer即clearTimeout ， 并将字本显示为'micro_second too'
再添加一个countdown4micro方法 ， 使得显示剩余 0:3:19 89这样形式的倒数
文章插图
如此这般 ， 毫秒与时分秒是分别运行渲染的 ， 再次改造 ， 程序可读性更好 。dateformat针对于毫秒操作 ， 而不接受秒为数 。同时还省却了计算100次为1s的运算
文章插图
【微信小程序教程-倒计时组件实现代码】经过如上优化 ， 代码量减少一半 ， 运行效率也高了 。
推荐阅读
- Win10怎么清除电脑使用痕迹？
- 小米手机怎么充值公交卡？详细操作流程
- 今日头条怎么直播？今日头条直播方法步骤
- Win10修复电脑的命令提示符有哪些？
- QQ浏览器如何免流量使用_具体操作流程
- 微信小程序Page函数详解教程
- Win10电脑玩红警老是卡死该怎么解决？
- QQ浏览器将页面保存为图片具体操作过程
- 微信小程序开发者不得不知的知识