小程序wxs中的时间格式化以及格式化时间和date时间互转

WXS(WeiXin Script)是小程序的一套脚本语言,wxs 与 javascript 是不同的语言,有自己的语法,并不和 javascript 一致。其中包括了很多日常使用的javascript函数,在wxs中都是不能同样使用的。最近在做一个列表的时候,涉及到时间格式化操作。就遇到了这个问题,以前写好了的格式化工具函数直接拷贝到小程序项目的wxs文件中,函数不能正常执行。其中包括了下面的几个错误

  1. 正则表达式在字符串的replace函数中的使用方法不一样,不能直接使用var a = /[0-9]/这种方式声明使用。正确的方式为var reg = getRegExp("-", “g”);
  2. 获取当前时间不能通过new Date()获取,而是通过getDate方法获取。
  3. getDate(‘2018/12/12’)可以获取对应日期的date类型的时间。

按照上面的异同,修改过后的时间格式化函数代码为

var formatNumber = function (n) {
  n = n.toString()
  return n[1] ? n : '0' + n
}

var regYear = getRegExp("(y+)", "i");

var dateFormat = function (timestamp, format) {
  if (!format) {
    format = "yyyy-MM-dd hh:mm:ss";
  }
  timestamp = parseInt(timestamp);
  // 通过getDate()方法获取date类型的时间
  var realDate = getDate(timestamp);
  function timeFormat(num) {
    return num < 10 ? '0' + num : num;
  }
  var date = [
    ["M+", timeFormat(realDate.getMonth() + 1)],
    ["d+", timeFormat(realDate.getDate())],
    ["h+", timeFormat(realDate.getHours())],
    ["m+", timeFormat(realDate.getMinutes())],
    ["s+", timeFormat(realDate.getSeconds())],
    ["q+", Math.floor((realDate.getMonth() + 3) / 3)],
    ["S+", realDate.getMilliseconds()],
  ];
  var reg1 = regYear.exec(format);
  // console.log(reg1[0]);
  if (reg1) {

    format = format.replace(reg1[1], (realDate.getFullYear() + '').substring(4 - reg1[1].length));
  }
  for (var i = 0; i < date.length; i++) {
    var k = date[i][0];
    var v = date[i][1];
    // getRegExp初始化一个正则表达式对象
    var reg2 = getRegExp("(" + k + ")").exec(format);
    if (reg2) {
      format = format.replace(reg2[1], reg2[1].length == 1
        ? v : ("00" + v).substring(("" + v).length));
    }
  }
  return format;
}

把格式化的日期时间字符串转换成时间戳

function parse(fmt) {
  fmt1 = fmt.substring(0, 19);
  var reg = getRegExp("-", "g");
  fmt2 = fmt1.replace(reg, '/');
  var timestamp = getDate(fmt2).getTime();
  return timestamp;
}

调用方法如下

function getDateByDateTimeFmt(dateTimeFmt) {
  return dateFormat(parse(dateTimeFmt), 'MM月dd日');
}
getDateByDateTimeFmt('2012-12-12 13:12:12') // => 12月12日
### 微信小程序中的时间格式化方法 在微信小程序中实现时间格式化的两种常见方式如下: #### 使用 JavaScript 实现 `getRelativeTime` 函数 此函数可以计算给定日期相对于当前时间的描述,适用于消息时间戳、日志记录等场景。对于输入的不同类型的参数(Date对象、数字或字符串),返回类似于 "1小时前" 或者 "昨天" 的描述。 ```javascript export const getRelativeTime = (date) => { let now = new Date(); let inputDate = new Date(date); let diffInSeconds = Math.floor((now - inputDate) / 1000); if(diffInSeconds < 60){ return `${diffInSeconds}秒前`; }else if(Math.floor(diffInSeconds/60)<60){ return `${Math.floor(diffInSeconds/60)}分钟前`; }else if(Math.floor(diffInSeconds/(60*60))<24){ return `${Math.floor(diffInSeconds/(60*60))}小时前`; }else{ var dayDiff = Math.floor(diffInSeconds/(60 * 60 * 24)); switch(dayDiff){ case 1: return '昨天'; case 2: return '前天'; default: if(dayDiff>2 && dayDiff<=7){ return `${dayDiff} 天前`; } else{ return inputDate.toLocaleDateString(); // 超过一周则显示具体日期 } } } } ``` 上述代码实现了根据不同时间段给出相应的时间描述[^1]。 #### 利用 WXS 进行页面内的时间格式化 另一种方案是在 `.wxml` 文件里利用 `<wxs>` 标签来加载外部定义好的辅助模块来进行时间处理。下面是一个简单的例子展示如何使用这种方法: ```html <wxs src="./path/to/utils/time.wxs" module="timeFormatter"></wxs> <view>{{ timeFormatter.formatTime(Date.now()) }}</view> ``` 这里假设有一个名为 `formatTime` 的函数存在于 `./path/to/utils/time.wxs` 中,并且它接收 Unix 时间戳作为参数并返回格式化后的字符串表示形式[^2]。 为了更清晰地理解这两种不同的实现途径及其应用场景,在实际项目开发过程中可以根据需求选择合适的方式完成时间数据的呈现工作。
评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值