antd-mobile的DatePicker分钟精度半小时
项目要求,在时间选择上需要精确到分钟,且分钟只能半小时,既0分钟或者是30分钟。
前期引用的时间控件是antd-mobile的DatePicker组件,具体用法可参考:https://mobile.ant.design/components/date-picker-cn/
其中组件有个minuteStep参数,将其设置成30,即可只显示0分钟或者30分钟了。
但是在选择的时候发现了问题,点击时间控件,弹出时间选择的界面,如果不去选择0分钟或者30分钟,直接点击确认,控件会选择到当前时间的分钟数,这是不合理的,解决方法:
使用到了moment对象,需要在项目中引入moment.js。增加一个判断,如果选择到30分钟了,即不变。如果不是30分钟则将分钟数设置为0,具体做法如下:
<DatePicker value={this.state.startTime} minuteStep = {30}
onChange={startTime => this.setState({startTime: new Date(startTime).getMinutes() == 30 ? startTime : moment( new Date(startTime).setMinutes(0) ) })}>
<List.Item arrow="horizontal"><font color="red"> * </font>开始时间</List.Item>
</DatePicker>
antd-mobile的DatePicker分钟精度半小时的更多相关文章
- Redis 在java中的使用(登录验证,5分钟内连续输错3次密码,锁住帐号,半小时后解封)(三)
在java中使用redis,做简单的登录帐号的验证,使用string类型,使用redis的过期时间功能 1.首先进行redis的jar包的引用,因为用的是springBoot,springBoot集成 ...
- spring定时器,当遇见半小时的情况时
spring定时器遇见半小时的解决方法(这里只提供注解方式) @Scheduled(fixedRate=6000000)//每隔100分钟执行方法 fixedRate的值是毫秒
- sql查询技巧,按时间分段进行分组,每半小时一组统计组内记录数量
今天拿到一个查询需求,需要统计某一天各个时间段内的记录数量. 具体是统计某天9:00至22:00时间段,每半小时内订单的数量,最后形成的数据形式如下: 时间段 订单数 9:00~9: ...
- React-Native 之 GD (十二)海淘半小时热门 及 获取最新数据个数功能 (角标)
1.海淘半小时热门 基本功能和首页相似 GDHt.js /** * 海淘折扣 */ import React, { Component } from 'react'; import { Style ...
- Oracle中获取当前时间半小时前的时间
最近项目中有个要根据半个小时前的数据情况判断某一栏位的值,但是一直没想到怎样获取当前时间的半小时前的时间,今天突然想到可以通过sysdate做差来获取,比如sysdate-1这样的,刚开始没有对结果进 ...
- Quartz 设置一个半小时任务实现
该文章属于本人原创,转载请注明出处. spring + Quartz 设置定时任务时要求没一个半小时执行一次 设置两个相同的定时任务 第一个从整点开始每三小时执行一次 ...
- 半小时学会上传本地项目到github
半小时学会上传本地项目到github 闲着无聊写给那些正在学习怎么上传本地项目到github的同学. 开始学习 一.创建github账号 好吧,这步多余了. 二.创建个人仓库 三.配置SSH keys ...
- smarty半小时快速上手入门教程
http://www.jb51.net/article/56754.htm http://www.yiibai.com/smarty/smarty_functions.html http://www. ...
- 每篇半小时1天入门MongoDB——2.MongoDB环境变量配置和Shell操作
上一篇:每篇半小时1天入门MongoDB——1.MongoDB介绍和安装 配置环境变量 Win10系统为例 右键单击“此电脑”——属性——高级系统设置——高级——环境变量,添加C:\Program F ...
随机推荐
- springboot内置tomcat配置虚拟路径
在Springboot中默认的静态资源路径有:classpath:/METAINF/resources/,classpath:/resources/,classpath:/static/,classp ...
- 程序面试题——C实现
平台:win10 x64 +VC6.0 2019/5/22 1.合并三个有序的链表 链表节点定义struct node{ int val; struct node* next;}; str ...
- Dart中的匿名方法与自执行方法
void main() { // 匿名方法 var printSomethings = () { print("somethings"); }; printSomethings() ...
- CP and Tucker Tensor Decomposition
1.. 2..
- kotlin函数加强
在之前已经接触过了kotlin的函数了,这里再次加强学习下它,下面开始吧! Kotlin函数编写规则: 对照函数来理解其写法: 演练巩固: ①.编写函数, 实现四则运算. 接着来实现其它三个运算: 然 ...
- linux下devel软件包作用
devel 包主要是供开发用,至少包括以下2个东西: 头文件 链接库 有的还含有开发文档或演示代码. 以 glib 和 glib-devel 为例: 如果你安装基于 glib 开发的程序,只需要安装 ...
- 使用PyInstaller将.py文件打包并生成Windows下可执行的.exe文件
最近要使用Qt写一个简单的GUI程序,因此使用了PyQt5来加快开发,使用PyQt5生成可执行的程序时,在Windows操作系统下可以使用pyinstaller库将.py文件及其相关依赖生成为.exe ...
- [NOI2014]购票——斜率优化+树链剖分+线段树
建议到UOJ上去交 题解 一眼\(DP\),先把转移方程写出来 设\(dp[i]\)为从点\(i\)出发到点\(1\)的最小费用,那么存在转移 \[f[i]=min\{f[j]+(d[i]-d[j]) ...
- 使用Ajax中get请求发送Token时踩的那些坑
在使用惯了各种牛X的插件以后,在使用原生组件写一些小东西的时候总是有踩不完的坑! 今天就来说一说我使用原生ajax请求时踩得坑: 下面是我的代码: var xmlhttp; if (window.XM ...
- Codeforces Round #509 (Div. 2) E. Tree Reconstruction(构造)
题目链接:http://codeforces.com/contest/1041/problem/E 题意:给出n - 1对pair,构造一颗树,使得断开其中一条边,树两边的最大值为 a 和 b . 题 ...