编译环境
微信开发者工具
问题
在小程序中无法实现对日期的切割,并且可能会出现日期少一天的问题,这个问题可以由后端进行解决,也可以前端,这里用了前端新建一个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,如果想要别的格式的朋友也自行切割添加即可。