微信小程序手写文件解决日期少一天且格式无法切割问题

编译环境

微信开发者工具

问题

在小程序中无法实现对日期的切割，并且可能会出现日期少一天的问题，这个问题可以由后端进行解决，也可以前端，这里用了前端新建一个wxs转换文件进行解决。
比如数据库中的数据是2024-03-02… 但是返回给前端的是2024-03-01…

第一步

在utils文件夹下新建一个文件名叫filter.wxs，这个文件主要的价值就是进行日期转换和添加1一天的操作。

添加内容

function addOneDay(dateStr) {
  var parts = dateStr.split('-');
  var year = parseInt(parts[0], 10);
  var month = parseInt(parts[1], 10);
  var day = parseInt(parts[2], 10);

  day += 1;

  var daysInMonth = getDaysInMonth(year, month);
  if (day > daysInMonth) {
    day = 1;
    month += 1;
    if (month > 12) {
      month = 1;
      year += 1;
    }
  }

  return formatYearMonthDay(year, month, day);
}

function getDaysInMonth(year, month) {
  switch (month) {
    case 1: case 3: case 5: case 7: case 8: case 10: case 12:
      return 31;
    case 4: case 6: case 9: case 11:
      return 30;
    case 2:
      if ((year % 4 === 0 && year % 100 !== 0) || year % 400 === 0) {
        return 29;
      } else {
        return 28;
      }
    default:
      return 30; 
  }
}

function formatYearMonthDay(year, month, day) {
  var monthStr = month < 10 ? '0' + month : '' + month;
  var dayStr = day < 10 ? '0' + day : '' + day;
  return year + '-' + monthStr + '-' + dayStr;
}

module.exports = {
  addOneDay: addOneDay
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47

在wxml文件中引入这个文件

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

使用

<text>日期: {{filter.addOneDay(ldate)}}</text>
1

解决，如果有兴趣看点解决问题的过程，请往下看

详解代码

在上述文件中我们创建了三个函数，第一个函数add主要是用户对日期的添加，因为微信开发者工具不允许使用部分date函数，这里我们用到的是parseInt来进行切割，并且考虑到了年初和闰月的问题，最后调用一个日期格式化的函数。返回的就是添加一天且日期格式化的函数。但是格式是yyyy-mm-dd，如果想要别的格式的朋友也自行切割添加即可。