解决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 相关文章推荐
捕获关闭窗口的脚本
Jan 10 Javascript
jQuery实现商品活动倒计时
Oct 16 Javascript
可输入文字查找ajax下拉框控件 ComBox的实现方法
Oct 25 Javascript
JS 实现导航菜单中的二级下拉菜单的几种方式
Oct 31 Javascript
jQuery.parseHTML() 函数详解
Jan 09 Javascript
Vue实例简单方法介绍
Jan 20 Javascript
详解Vue中状态管理Vuex
May 11 Javascript
手淘flexible.js框架使用和源代码讲解小结
Oct 15 Javascript
详解Vue底部导航栏组件
May 02 Javascript
vue router 跳转时打开新页面的示例方法
Jul 28 Javascript
jquery绑定事件 bind和on的用法与区别分析
May 22 jQuery
JS Canvas接口和动画效果大全
Apr 29 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_MySQL教程-第一天
2007/03/18 PHP
PHP基础知识回顾
2012/08/16 PHP
PHP添加Xdebug扩展的方法
2014/02/12 PHP
PHP统计nginx访问日志中的搜索引擎抓取404链接页面路径
2014/06/30 PHP
php中getservbyport与getservbyname函数用法实例
2014/11/18 PHP
实现PHP+Mysql无限分类的方法汇总
2015/03/02 PHP
thinkphp ajaxfileupload实现异步上传图片的示例
2017/08/28 PHP
PHP反射原理与用法深入分析
2019/09/28 PHP
jQuery控制TR显示隐藏的三种常用方法
2014/08/21 Javascript
js如何打印object对象
2015/10/16 Javascript
javascript函数自动执行常用方法汇总
2016/03/28 Javascript
jquery实现左右滑动式轮播图
2017/03/02 Javascript
Angular.JS中指令ng-if、ng-show/ng-hide和ng-switch的使用教程
2017/05/07 Javascript
详解webpack自动生成html页面
2017/06/29 Javascript
json数据传到前台并解析展示成列表的方法
2018/08/06 Javascript
element ui 表格动态列显示空白bug 修复方法
2018/09/04 Javascript
微信小程序当前时间时段选择器插件使用方法详解
2018/12/28 Javascript
解决layer.open弹出框不能获取input框的值为空的问题
2019/09/10 Javascript
[02:00]DOTA2英雄COSPLAY闹市街头巡游助威2015国际邀请赛
2015/08/02 DOTA
python使用pil生成图片验证码的方法
2015/05/08 Python
python解决汉字编码问题:Unicode Decode Error
2017/01/19 Python
Python中字典的setdefault()方法教程
2017/02/07 Python
matplotlib简介,安装和简单实例代码
2017/12/26 Python
python实现决策树ID3算法的示例代码
2018/05/30 Python
详解Python发送email的三种方式
2018/10/18 Python
对Python w和w+权限的区别详解
2019/01/23 Python
tesserocr与pytesseract模块的使用方法解析
2019/08/30 Python
python SVD压缩图像的实现代码
2019/11/05 Python
使用Django实现把两个模型类的数据聚合在一起
2020/03/28 Python
CSS3中animation实现流光按钮效果
2020/12/21 HTML / CSS
高分子材料与工程专业个人求职信
2013/12/15 职场文书
仓库管理专业个人的自我评价
2013/12/30 职场文书
组织关系转移介绍信
2014/01/16 职场文书
我的教育故事演讲稿
2014/05/04 职场文书
Python图像处理库PIL详细使用说明
2022/04/06 Python
Android存储中最基本的文件存储方式
2022/04/30 Java/Android