解决antd datepicker 获取时间默认少8个小时的问题


Posted in Javascript onOctober 29, 2020

1、扩展日期格式化方法

Date.prototype.format = function (fmt) {
 let o = {
  "M+": this.getMonth() + 1,         //月份
  "d+": this.getDate(),          //日
  "h+": this.getHours(),          //小时
  "m+": this.getMinutes(),         //分
  "s+": this.getSeconds(),         //秒
  "q+": Math.floor((this.getMonth() + 3) / 3), //季度
  "S": this.getMilliseconds()       //毫秒
 };
 if (/(y+)/.test(fmt)) {
  fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));
 }
 for (let k in o) {
  if (new RegExp("(" + k + ")").test(fmt)) {
   fmt = fmt.replace(RegExp.$1, (RegExp.$1.length === 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
  }
 }
 return fmt;
};

2、对选中日期的时间进行格式化处理,最终得到的时间就是当前时间

new Date(value).format(“yyyy-MM-dd hh:mm:ss”)

补充知识:antd datepicker设置开始时间和期限计算出结束时间并且去除周六日

datepicker 需要使用moment格式的时间作为value,但是在操作 此value时,包括moment.add()等方法都会直接改变datepicker的值,即使没有重新赋值。此时需要配合moment-immutable-methods使用

import { momentImmutableMethods } from 'moment-immutable-methods'
momentImmutableMethods(moment)

getFinishTime=(value)=>{
    const {getFieldValue} = this.props.form
    let i = 0
    if(typeof(value)==="number"){
      let incomingTime = getFieldValue("incomingTime")
      while(i<value){
        if(incomingTime.addImmu(1,'d').weekday()!==5&&incomingTime.addImmu(1,'d').weekday()!==6){
          i++
          incomingTime = incomingTime.addImmu(1,'d')
        }else{
          incomingTime = incomingTime.addImmu(1,'d')
        }
      }
      this.setState({
        finishTime:value===16?moment():incomingTime,
        disabledFinishTime:value===16?false:true
      })
    }else if(typeof(value)==="object"){
      let deadTime = getFieldValue("deadTime")
      while(i<deadTime){
        if(value.addImmu(1,'d').weekday()!==5&&value.addImmu(1,'d').weekday()!==6){
          i++
          value = value.addImmu(1,'d')
        }else{
          value = value.addImmu(1,'d')
        }
      }
      this.setState({
        finishTime:deadTime===16?moment():value,
        disabledFinishTime:deadTime===16?false:true
      })
    }
 }

以上这篇解决antd datepicker 获取时间默认少8个小时的问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
奇妙的js
Sep 24 Javascript
javascript 禁止复制网页
Jun 11 Javascript
html+javascript实现可拖动可提交的弹出层对话框效果
Aug 05 Javascript
jquery中checkbox使用方法简单实例演示
Nov 24 Javascript
详解js跨域原理以及2种解决方案
Dec 09 Javascript
AngularJS使用angular-formly进行表单验证
Dec 27 Javascript
分享几种比较简单实用的JavaScript tabel切换
Dec 31 Javascript
JavaScript实现跑马灯抽奖活动实例代码解析与优化(一)
Feb 16 Javascript
AngularJS控制器之间的通信方式详解
Nov 03 Javascript
利用js给datalist或select动态添加option选项的方法
Jan 25 Javascript
vue实现数字动态翻牌的效果(开箱即用)
Dec 08 Javascript
JS实现电脑虚拟键盘的操作
Jun 24 Javascript
Antd中单个DatePicker限定时间输入范围操作
Oct 29 #Javascript
微信小程序实现可长按移动控件
Nov 01 #Javascript
Vue时间轴 vue-light-timeline的用法说明
Oct 29 #Javascript
antd日期选择器禁止选择当天之前的时间操作
Oct 29 #Javascript
vue制作toast组件npm包示例代码
Oct 29 #Javascript
antd-日历组件,前后禁止选择,只能选中间一部分的实例
Oct 29 #Javascript
解决antd日期选择组件,添加value就无法点击下一年和下一月问题
Oct 29 #Javascript
You might like
php下尝试使用GraphicsMagick的缩略图功能
2011/01/01 PHP
利用PHP实现短域名互转
2013/07/05 PHP
PHP使用in_array函数检查数组中是否存在某个值
2015/03/25 PHP
thinkphp5.0整合phpsocketio完整攻略(绕坑)
2018/10/12 PHP
javascript 跳转代码集合
2009/12/03 Javascript
基于jquery的tab切换 js原理
2010/04/01 Javascript
JS获取后台Cookies值的小例子
2013/03/04 Javascript
js事件冒泡实例分享(已测试)
2013/04/23 Javascript
Extjs4 Treegrid 使用心得分享(经验篇)
2013/07/01 Javascript
js对列表中第一个值处理与jsp页面对列表中第一个值处理的区别详解
2013/11/05 Javascript
在JavaScript中操作时间之getUTCDate()方法的使用
2015/06/10 Javascript
新手快速学习JavaScript免费教程资源汇总
2015/06/25 Javascript
如何制作幻灯片(代码分享)
2017/01/06 Javascript
详解tween.js 中文使用指南
2018/01/05 Javascript
详解基于DllPlugin和DllReferencePlugin的webpack构建优化
2018/06/28 Javascript
Javascript中的this,bind和that使用实例
2019/12/05 Javascript
vue实现表单未编辑或未保存离开弹窗提示功能
2020/04/08 Javascript
js实现弹幕飞机效果
2020/08/27 Javascript
JavaScript实现瀑布流布局的3种方式
2020/12/27 Javascript
[14:00]DOTA2国际邀请赛史上最长大战 赛后专访B神
2013/08/10 DOTA
[51:53]DOTA2-DPC中国联赛 正赛 RNG vs Dragon BO3 第二场 1月24日
2021/03/11 DOTA
使用Python中的greenlet包实现并发编程的入门教程
2015/04/16 Python
使用Python来编写HTTP服务器的超级指南
2016/02/18 Python
解决torch.autograd.backward中的参数问题
2020/01/07 Python
django API 中接口的互相调用实例
2020/04/01 Python
python小程序之4名牌手洗牌发牌问题解析
2020/05/15 Python
详解基于Facecognition+Opencv快速搭建人脸识别及跟踪应用
2021/01/21 Python
猫咪家具:CatsPlay
2018/11/03 全球购物
SQL SERVER面试资料
2013/03/30 面试题
韩语专业本科生求职信
2013/10/01 职场文书
小学教师师德感言
2014/02/10 职场文书
分层教学实施方案
2014/03/19 职场文书
公司自我介绍演讲稿
2014/08/21 职场文书
群众路线党员自我评议范文2014
2014/09/24 职场文书
2014年幼儿园德育工作总结
2014/12/17 职场文书
选调生挂职锻炼工作总结
2015/10/23 职场文书