小程序倒计时组件实现源

小程序，很多都要使用倒计时插件，如秒杀功能，如验证码倒计时，那么以下是小程序倒计时的插件。

介绍：

用于在微信小程序中倒计时的组件。

功能：

1，最基本的当然是倒计时功能。

2.您可以设置在倒计时结束后执行的事件。

3.您可以在倒计时执行期间每隔几秒设置相应的事件。

在JS中调用

1.介绍当前的js

Timer=require（'././plug/wxTimer.js'）

2.在全球app.js中引入

App.js

globalData: {

userInfo: null，

定时器:需要（'/plug/wxTimer.js'）

}

当前的js

Var app=getApp（）。globalData，

Timer=app.timer;

最简单的呼叫方式：

Var wxTimer=新计时器（{

beginTime: '00: 00: 10'

}）

wxTimer.start（本）;

wxTimer.stop（）;

打开多个时间

//打开第一个计时器

Var wxTimer1=新计时器（{

beginTime: '00: 00: 10'，

名称:'wxTimer1'，

完成:函数（）{

CONSOLE.LOG（ '已完成'）

}

}）

wxTimer1.start（本）;

//打开第二个计时器

Var wxTimer2=新计时器（{

beginTime: '00: 01: 11'，

名称:'wxTimer2'，

完成:函数（）{

CONSOLE.LOG（ '已完成'）

}

}）

wxTimer2.start（本）;

在倒计时结束后执行该事件

Var wxTimer=新计时器（{

beginTime: '00: 00: 10'，

完成:函数（）{

CONSOLE.LOG（ '已完成'）

}

}）

wxTimer.start（本）;

间隔执行事件

Var wxTimer=新计时器（{

beginTime: '00: 00: 10'，

完成:函数（）{

CONSOLE.LOG（ '已完成'）

}，

间隔: 2，

intervalFn: function（）{

Console.log（'2秒过去'）;

}

}）

校准时间

wxTimer.calibration（）;

结束时间

wxTimer.stop（）;

参考wxml

单个计时器：

显示剩余时间：{{wxTimer}}

显示剩余秒数：{{wxTimerSecond}}

多个计时器：

显示定时器1的剩余时间：{{wxTimerList ['wxTimer1']。wxTimer}}

显示定时器2的剩余时间：{{wxTimerList ['wxTimer2']。wxTimer}}

显示定时器1的剩余秒数：{{wxTimerList ['wxTimer1']。wxTimerSecond}}

显示定时器2的剩余秒数：{{wxTimerList ['wxTimer2']。wxTimerSecond}}

注意：

1，因为内部需要调用小程序的setData方法，所以我们需要传递这个。

2，这个方法会在页面中生成一个名为wxTimer，wxTimerSecond和wxTimerList的数据，请确保这些键没有被占用3，请在数据中添加属性wxTimerList: {}，否则会出错。

其他参数：

1，beginTime需要倒计时时间，例如：'01: 11: 12'，默认值为'00: 00: 00'，你也可以省略秒数，如: '01: 10'

2，倒计时返回零时完成回调函数，如果是beginTime='00: 00: 00'，则立即调用

3，间隔倒计时过程，规定intervalFn每隔几秒执行一次，如果是0，则永远不会执行，默认为1

4，intervalFn函数每隔一秒执行一次。

HiShop小程序工具提供多种类型的商城/商店小程序制作，可视化编辑1秒，在线生成5个步骤。通过拖动和拼接模块布局小程序商城页面，你可以看到你得到的东西，你只需要艺术家来制作一个漂亮的商场。更多小程序开发案例可在以下网址获得：http://www.hvihi.com/xiaocx/kaifa.html

＆lt; 汇海（www.hvihi.com）是国内知名的商城系统和商城网站建设提供商，其中汇海技术小程序系统提供小程序商城开发，小程序配送系统，微分配系统，商城系统，电子商务网站建设， 微信发行系统，小程序商城及其他多端商场和电子商务行业解决方案＆gt;

确认：这个文件和图像源网络编辑器的网站部分，如果有侵权及时通信删除。 汇海hvihi.com网站原创文章，请注明出处。