解决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 相关文章推荐
编写兼容IE和FireFox的脚本
May 18 Javascript
怎么清空javascript数组
May 11 Javascript
JS验证字符串功能
Feb 22 Javascript
详解Angular CLI + Electron 开发环境搭建
Jul 20 Javascript
详解React 在服务端渲染的实现
Nov 16 Javascript
jquery动态添加带有样式的HTML标签元素方法
Feb 24 jQuery
浅谈Vue网络请求之interceptors实际应用
Feb 28 Javascript
JavaScript实现的反序列化json字符串操作示例
Jul 18 Javascript
layui prompt 设置允许空白提交的方法
Sep 24 Javascript
JavaScript判断数组类型的方法
Oct 23 Javascript
vuex 实现getter值赋值给vue组件里的data示例
Nov 05 Javascript
jQuery操作元素追加内容示例
Jan 10 jQuery
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
discuz Passport 通行证 整合笔记
2008/06/30 PHP
PHP循环输出指定目录下的所有文件和文件夹路径例子(简单实用)
2014/05/10 PHP
php中json_encode UTF-8中文乱码的更好解决方法
2014/09/28 PHP
php网站被挂木马后的修复方法总结
2014/11/06 PHP
php字符串函数学习之strstr()
2015/03/27 PHP
PHP如何使用Memcached
2016/04/05 PHP
PHP编写登录验证码功能 附调用方法
2016/05/19 PHP
Laravel核心解读之异常处理的实践过程
2019/02/24 PHP
PHP钩子实现方法解析
2019/05/21 PHP
showModelessDialog()使用详解
2006/09/21 Javascript
javascript 冒号 使用说明
2009/06/06 Javascript
JS 参数传递的实际应用代码分析
2009/09/13 Javascript
javascript一些实用技巧小结
2011/03/18 Javascript
jQuery 一个图片切换的插件
2011/10/09 Javascript
jquery利用ajax调用后台方法实例
2013/08/23 Javascript
jquery事件与函数的使用介绍
2013/09/29 Javascript
利用try-catch判断变量是已声明未声明还是未赋值
2014/03/12 Javascript
Node.js实现在目录中查找某个字符串及所在文件
2014/09/03 Javascript
详解JavaScript的另类写法
2016/04/11 Javascript
整理关于Bootstrap警示框的慕课笔记
2017/03/29 Javascript
jQuery之动画ajax事件(实例讲解)
2017/07/18 jQuery
WebGL three.js学习笔记之阴影与实现物体的动画效果
2019/04/25 Javascript
vue 使用element-ui中的Notification自定义按钮并实现关闭功能及如何处理多个通知
2019/08/17 Javascript
Webpack3+React16代码分割的实现
2021/03/03 Javascript
python简单判断序列是否为空的方法
2015/06/30 Python
python 出现SyntaxError: non-keyword arg after keyword arg错误解决办法
2017/02/14 Python
python使用matplotlib画饼状图
2018/09/25 Python
numpy库与pandas库axis=0,axis= 1轴的用法详解
2019/05/27 Python
Pymysql实现往表中插入数据过程解析
2020/06/02 Python
个人简历的自荐信
2013/10/23 职场文书
高中地理教学反思
2014/01/29 职场文书
马云北大演讲完整版:真心话,什么才是阿里的核心竞争力?
2014/04/04 职场文书
保密工作责任书
2014/04/16 职场文书
《乡下孩子》教学反思
2014/04/17 职场文书
社区文明创建工作总结2015
2015/04/21 职场文书
导游词之徐州云龙湖
2019/11/19 职场文书