FlexoCalendar周日历出错的解决方法

大部分日历控件都是日视图,月视图和年视图。由于项目需要周视图,找到了一位大神写的插件FlexoCalendar,提供了周视图。用得还挺顺手,最后才发现每年12月份会出错。如下图:

FlexoCalendar周日历出错的解决方法_第1张图片

上图是默认的(不是用户选择)情况,2017-12-25,2017-12-31正常。


FlexoCalendar周日历出错的解决方法_第2张图片

上图是用户选择第二周之后出现了错误,应该是2017-12-10变成了2018-12-10.


FlexoCalendar周日历出错的解决方法_第3张图片

接着我又看了2018年12月,依然出现错误。很明显是写这个日历控件的大神把年份多加了一年,我们来看看这段代码在哪里,在FlexoCalendar.js文件我们可以看到:

endYear = startMonth == 12 ? startYear + 1 : startYear ;
原来是当12月份时,大神把每一个周的endYear都加了1,明显不对,那我们稍微修改一下:

endYear = startMonth == 12 ? startYear  : startYear ;
这样貌似对了,但是我们要想象一下大神为什么会有个加一呢,哦,应该是当第五周中如果出现了下一年的日期就要加一,如下图(2016年12月):

FlexoCalendar周日历出错的解决方法_第4张图片

很明显第五周中如果出现了下一年的日期,这样也会出错,那怎么改才会完全正确呢,那就是下面的代码了:

endYear = startMonth == 12 && parseInt(endDay)<7? startYear +1  : startYear ;

把原来的一行代码换成上面我提供的,就没问题了,如下:

FlexoCalendar周日历出错的解决方法_第5张图片


因时间仓促,资质有限,文中表述仅代表个人观点,如果有更好的想法,欢迎分享。


你可能感兴趣的:(前端开发JS,FlexoCalendar,周历,日历)