• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    公众号

小程序:(微信小程序)小程序中使用自定义函数

原作者: [db:作者] 来自: [db:来源] 收藏 邀请

  我们在开发微信小程序的时候,会用到自定义的函数功能,那么我们如何在小程序中写这些JS,又如何在WXML中调用它们呢 ?换句话说在微信小程序{{}}中直接调用自定义的函数 ?

  微信小程序的API:https://developers.weixin.qq.com/miniprogram/dev/reference/wxs/01wxs-module.html

一、创建公共的JS文件

         本着代码的规范化和项目的工程化,小程序中公共JS文件一般创建在utils目录下,这样,我们就可以在每个模块页面里调用它。比如:这里创建了一个公共文件:time.wxs(PS:微信小程序的公共文件一定要是wxs后缀),如图所示:

二、编写相关应用函数

  打开time.wxs文件,然后在里面编写函数:

 1 /**
 2  * 时间格式化:年月日是分秒
 3  * @param {*} timestamp :时间戳13位
 4  * @param {*} type:需要转化后的时间格式
 5  * eg. cn: 2020年02月02日 ; en:2020.02.02
 6  */
 7 var timeFormat = {
 8     timestampToTime: function (timestamp, type) {
 9         if (timestamp && type === \'cn\') {
10             let date = new Date(timestamp);//时间戳为10位需*1000,时间戳为13位的话不需乘1000
11             let Y = date.getFullYear() + \'年\';
12             let M = (date.getMonth() + 1 < 10 ? (date.getMonth() + 1) : date.getMonth() + 1) + \'月\';
13             let D = date.getDate() + \'日\';
14             let h = date.getHours() < 10 ? \'0\' + (date.getHours()) + \':\' : date.getHours() + \':\';
15             let m = date.getMinutes() < 10 ? \'0\' + (date.getMinutes()) : date.getMinutes();
16             let s = date.getSeconds();
17 
18             return M + D + h + m;
19         }
20         if (timestamp && type === \'en\') {
21             let date = new Date(timestamp);//时间戳为10位需*1000,时间戳为13位的话不需乘1000
22             let Y = date.getFullYear() + \'.\';
23             let M = (date.getMonth() + 1 < 10 ? \'0\' + (date.getMonth() + 1) : date.getMonth() + 1) + \'.\';
24             let D = date.getDate() + \'\';
25             let h = date.getHours() < 10 ? \'0\' + (date.getHours()) + \':\' : date.getHours() + \':\';
26             let m = date.getMinutes() < 10 ? \'0\' + (date.getMinutes()) : date.getMinutes();
27             let s = date.getSeconds();
28 
29             return Y + M + D;
30         }
31     }
32 };
33 
34 
35 // 导出对外暴露的属性
36 module.exports = {
37     timestampToTime: timeFormat.timestampToTime
38 }

  说明:

       1、定义一个整体变量,以var开头,   

     var 变量 = {};
   2、编写函数。函数格式为:
    函数名:function(参数) {},具体参见上面的例子

  3、通过module.exports引用函数,写法如下:
    module.exports = {
      被使用的函数名:变量.具体函数
    }

三、如何试用

1、在使用的页面头部引入文件,引入方式是:

 

1 <wxs module="time" src="../../utils/time.wxs"></wxs>

 


说明:
module="文件名",我在utils文件夹里定义的文件名是time,所以这里的名称与之对应
2、函数调用
1 <view class="msg">{{time.timestampToTime(item.endTime, "cn")}}已开奖</view>

 

 

 

 

 

 


鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
上一篇:
微信小程序(18)-- 自定义头部导航栏发布时间:2022-07-18
下一篇:
❥微信小程序❥----小程序基础发布时间:2022-07-18
热门推荐
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap