antd踩坑:日期选择器的可选日期控制的问题
有一个需求是日期选择需要加一个日期限制。
于是我兴高采烈的加上去了。
// 日期可选判断方法
disabledDateFunc = current => {
const { disabledDateArray } = this.state;
if (disabledDateArray) {
return (
current && (current < disabledDateArray[0] || current > disabledDateArray[1])
);
} else {
return current;
}
};
结果发现一个问题:
比如我希望 用户可以选择 4月1日 到4月4日 。
结果 4月4日 也不能选?
后来知道原因了。
日期选择器用的是 moment 库。
当声明 moment 对象的时候,如果只声明日期,没有声明时间,时间就是当前时间(日期当然是声明的日期)。
而当前时间一定是在今天之内的,也就是说当判断的时候,临界值的时间会比当前时间小!
所以最后一天就不能选择了。
解决方法很简单。
// 日期可选判断方法
disabledDateFunc = current => {
const { disabledDateArray } = this.state;
if (disabledDateArray) {
return (
current && (current < disabledDateArray[0] || current > disabledDateArray[1].endOf('day'))
);
} else {
return current;
}
};
OK。解决问题。
以上
antd踩坑:日期选择器的可选日期控制的问题的更多相关文章
- element-ui DatePicker 日期选择器 让结束日期大于开始日期
element-ui DatePicker 日期选择器 <el-date-picker v-model="addForm.startDate" type="dat ...
- antd踩坑:value.locale is not a function
这个问题来源于日期选择器 RangerPicker 的特殊情况. <Col span={7} key={9}> <FormItem label="投运时间" {. ...
- react : umi 引入 antd 踩坑
首先要明确一个问题. 不管是 antd 还是 dva 还是别的什么东西,他们都是 umi 的插件——只要这个项目是使用 umi 脚手架生成的. 所以第一步应该是 .umirc.js (config.j ...
- 日期选择器:jquery datepicker的使用
helloweba.com 作者:月光光 时间:2012-04-08 21:05 标签: jquery datepicker jquery ui 在jquery ui中,提供了一个非常实用 ...
- Android零基础入门第57节:日期选择器DatePicker和时间选择器TimePicker
原文:Android零基础入门第57节:日期选择器DatePicker和时间选择器TimePicker 在实际开发中,经常会遇见一些时间选择器.日期选择器.数字选择器等需求,那么从本期开始来学习And ...
- Android中DatePicker日期选择器的使用和获取选择的年月日
场景 实现效果如下 注: 博客: https://blog.csdn.net/badao_liumang_qizhi 关注公众号 霸道的程序猿 获取编程相关电子书.教程推送与免费下载. 实现 将布局改 ...
- lua时间戳和日期转换及踩坑
介绍lua的日期函数常用方法及我的一个踩坑. 时间戳转日期 os.date("%Y%m%d%H",unixtime) --os.date("%Y%m%d%H", ...
- java用毫秒数做日期计算的一个踩坑记录
错误示例: Date today = new Date(); Date nextMonth = new Date(today.getTime() + 30* 1000*60*60*24); print ...
- Date()日期函数浏览器兼容问题踩坑
原文:Date()日期函数浏览器兼容问题踩坑 之前用layui做的一项目中,table中用到了日期格式化的问题.直接没多想,撸代码就完了呗,结果最近一段时间客户反馈说显示日期跟录入日期不一样(显示日期 ...
随机推荐
- 【原创】强撸基于 .NET 的 Redis Cluster 集群访问组件
Hello 大家好,我是TANZAME,我们又见面了.今天我们来聊聊怎么手撸一个 Redis Cluster 集群客户端,纯手工有干货,您细品. 随着业务增长,线上环境的QPS暴增,自然而然将当前的单 ...
- PyCharm远程连接服务器简明教程
转自本人知乎(https://zhuanlan.zhihu.com/p/149040742) 由于实验室的GPU都是放在远程服务器上,因此一直使用MobaXterm利用SSH远程跑实验,但是MobaX ...
- Unable to resolve dependency for ':app@debug/compileClasspath': Could not find any version that matc
错误展示: 错误提示: Unable to resolve dependency for ':app@debug/compileClasspath': Could not find any versi ...
- MongoDB副本集replica set (二)--副本集环境搭建
(一)主机信息 操作系统版本:centos7 64-bit 数据库版本 :MongoDB 4.2 社区版 ip hostname 192.168.10.41 mongoserver1 192.16 ...
- 4、struct2的支持团队开发
在一个大型的项目中,不同的人都开发不同的模块,不能所有的人都去操作同一个struct.xml文件,我们应该对于不同的模块对应不同的配置文件 列如我们对应的登陆模块,我们可以编写一个登陆的配置文件 1. ...
- Python学习之准备工作
Python学习之准备工作 编程语言历史 在计算机硬件基础中我们大概介绍了一下计算机的发展历史.了解到在曾经有一段时期里计算机是不存在操作系统这一概念的,所有需要计算机完成的操作都需要当时的程序员来与 ...
- JVM的堆内存泄漏排查-性能测试
JVM异常说明 https://testerhome.com/articles/24259 一文中已介绍了,JVM每个运行时区域--程序计数器 .Java虚拟机栈.本地方法栈.Java堆.方法区.直接 ...
- 千金良方说:"我现在奉上179341字的MySQL资料包,还来得及吗?有"代码段、附录、和高清图!!"
上一篇"上发布过"一不小心,我就上传了 279674 字的 MySQL 学习资料到 github 上了",我在更早之前,在微信公众号"老叶茶馆"上发布 ...
- ceph SSD HDD分离与openstack调用
本例子ceph L版本采用的是filestore,而不是bluestore. 一.查看class类型,只有一个hdd,.Luminous 为每个OSD添加了一个新的属性:设备类.默认情况下,OSD将根 ...
- Python实用笔记 (17)模块
一个abc.py的文件就是一个名字叫abc的模块,一个xyz.py的文件就是一个名字叫xyz的模块. 现在,假设我们的abc和xyz这两个模块名字与其他模块冲突了,于是我们可以通过包来组织模块,避免冲 ...