编译环境
微信开发者工具
问题
在小程序中无法实现对日期的切割,并且可能会出现日期少一天的问题,这个问题可以由后端进行解决,也可以前端,这里用了前端新建一个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
}
在wxml文件中引入这个文件
<wxs module="filter" src="/utils/filter.wxs"></wxs>
使用
<text>日期: {{filter.addOneDay(ldate)}}</text>
解决,如果有兴趣看点解决问题的过程,请往下看
详解代码
在上述文件中我们创建了三个函数,第一个函数add主要是用户对日期的添加,因为微信开发者工具不允许使用部分date函数,这里我们用到的是parseInt来进行切割,并且考虑到了年初和闰月的问题,最后调用一个日期格式化的函数。返回的就是添加一天且日期格式化的函数。但是格式是yyyy-mm-dd,如果想要别的格式的朋友也自行切割添加即可。