我是靠谱客的博主 飞快西装,最近开发中收集的这篇文章主要介绍VUE 之 Element 限定日期范围pickerOptions使用方法及绕坑指南,觉得挺不错的,现在分享给大家,希望可以做个参考。

概述

pickerOptions: {
   disabledDate: time => {
          let timeTmp = time.getTime();
          let startTmp = startDate.getTime()  - 24 * 60 * 60 * 1000;
          let endTmp = endDate.getTime();
	      return timeTmp < startTmp || timeTmp > endTmp;
     }
}

问: 为什么加多一天时间 (24 * 60 * 60 * 1000为一天)?
答: 因为element组件选取日期返回的时间是当天的0点;

以下绕坑
举个使用日期栗子(和传入element限定日期为什么要减一天原理一致):
当你选中element日期是2019年12月10号,
element返回的数据是 Tue Dec 10 2019 00:00:00 GMT+0800 (中国标准时间)
element返回的是这一天的 00:00:00秒,
转换时间戳是 1575907200000.
假设后台给我的数据是10号的中午12点,时间戳是1575950400000.
则判断错误的方法是:
1575950400000 < 1575907200000
而正确方法是:
1575950400000 < 1575907200000+(24 * 60 * 60 * 1000 -1)
这里细品, 不理解请动手转换时间戳就明白了;

时间戳转换方法如下:
new Date(1575907200000)
Tue Dec 10 2019 00:00:00 GMT+0800 (中国标准时间)

示例:https://www.cnblogs.com/cengjingdeshuige/p/11169629.html

最后

以上就是飞快西装为你收集整理的VUE 之 Element 限定日期范围pickerOptions使用方法及绕坑指南的全部内容,希望文章能够帮你解决VUE 之 Element 限定日期范围pickerOptions使用方法及绕坑指南所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错,欢迎将靠谱客网站推荐给程序员好友。

本图文内容来源于网友提供,作为学习参考使用,或来自网络收集整理,版权属于原作者所有。
点赞(52)

评论列表共有 0 条评论

立即
投稿
返回
顶部