解决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 相关文章推荐
用jquery实现点击栏目背景色改变
Dec 10 Javascript
JavaScript中为什么null==0为false而null大于=0为true(个人研究)
Sep 16 Javascript
Jquery attr(&quot;checked&quot;) 返回checked或undefined 获取选中失效
Oct 10 Javascript
jQuery实现鼠标滑向当前图片高亮显示并且其它图片变灰的方法
Jul 27 Javascript
JavaScript sort数组排序方法和自我实现排序方法小结
Jun 06 Javascript
Angularjs 设置全局变量的方法总结
Oct 20 Javascript
ES6中的Promise代码详解
Oct 09 Javascript
Vue filter介绍及详细使用
Apr 04 Javascript
node前端开发模板引擎Jade的入门
May 11 Javascript
vue初始化动画加载的实例
Sep 01 Javascript
仿vue-cli搭建属于自己的脚手架的方法步骤
Apr 17 Javascript
javascript实现移动端轮播图
Dec 09 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
重置版宣传动画
2020/04/09 魔兽争霸
php 运行效率总结(提示程序速度)
2009/11/26 PHP
php对接java现实加签验签的实例
2016/11/25 PHP
php 遍历目录,生成目录下每个文件的md5值并写入到结果文件中
2016/12/12 PHP
php基于 swoole 实现的异步处理任务功能示例
2019/08/13 PHP
MVC Ajax Helper或Jquery异步加载部分视图
2015/11/29 Javascript
谈谈我对JavaScript原型和闭包系列理解(随手笔记9)
2015/12/24 Javascript
JavaScript简单实现弹出拖拽窗口(二)
2016/06/17 Javascript
利用JS屏蔽页面中的Enter按键提交表单的方法
2016/11/25 Javascript
Three.js实现3D机房效果
2018/12/30 Javascript
js实现图片放大并跟随鼠标移动特效
2019/01/18 Javascript
Vue.js样式动态绑定实现小结
2019/01/24 Javascript
vue组件系列之TagsInput详解
2020/05/14 Javascript
使用JavaScript获取Django模板指定键值数据
2020/05/27 Javascript
python类参数self使用示例
2014/02/17 Python
python分割文件的常用方法
2014/11/01 Python
python实现随机梯度下降(SGD)
2020/03/24 Python
tensorflow 保存模型和取出中间权重例子
2020/01/24 Python
python实点云分割k-means(sklearn)详解
2020/05/28 Python
python接入支付宝的实例操作
2020/07/20 Python
css3中用animation的steps属性制作帧动画
2019/04/25 HTML / CSS
精灵市场:Pixie Market
2019/06/18 全球购物
英国索普公园票务和酒店套餐:Thorpe Breaks
2019/09/14 全球购物
什么是Rollback Segment
2013/04/22 面试题
StringBuilder和String的区别
2015/05/18 面试题
员工培训心得体会
2013/12/30 职场文书
报告会主持词
2014/04/02 职场文书
暑假家长评语大全
2014/04/17 职场文书
厨师个人自我鉴定范文
2014/04/19 职场文书
供电工程专业求职信
2014/08/09 职场文书
教师党员自我剖析材料
2014/09/29 职场文书
2014年学生会干事工作总结
2014/11/07 职场文书
员工辞职信怎么写
2015/02/27 职场文书
校运会通讯稿
2015/07/18 职场文书
Python中使用subprocess库创建附加进程
2021/05/11 Python
利用python调用摄像头的实例分析
2021/06/07 Python