解决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 相关文章推荐
XHTML-Strict 内允许出现的标签
Dec 11 Javascript
制作高质量的JQuery Plugin 插件的方法
Apr 20 Javascript
php上传图片并给图片打上透明水印的代码
Jun 07 Javascript
JavaScript中的Array对象使用说明
Jan 17 Javascript
js确认删除对话框适用于a标签及submit
Jul 10 Javascript
详解maxlength属性在textarea里奇怪的表现
Dec 27 Javascript
微信页面倒计时代码(解决safari不兼容date的问题)
Dec 13 Javascript
深入理解vue中slot与slot-scope的具体使用
Jan 26 Javascript
linux 后台运行node服务指令方法
May 23 Javascript
浅谈 Webpack 如何处理图片(开发、打包、优化)
May 15 Javascript
微信小程序云开发之新手环境配置
May 16 Javascript
uni-app自定义导航栏按钮|uniapp仿微信顶部导航条功能
Nov 12 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+jQuery+MySql实现红蓝(顶踩)投票代码
2015/08/25 PHP
php使用ffmpeg获取视频信息并截图的实现方法
2016/05/03 PHP
javascript实现仿银行密码输入框效果的代码
2007/12/13 Javascript
js+HTML5实现视频截图的方法
2015/06/16 Javascript
JavaScript实现点击按钮就复制当前网址
2015/12/14 Javascript
jquery自定义插件——window的实现【示例代码】
2016/05/06 Javascript
AngularJS入门教程中SQL实例详解
2016/07/27 Javascript
分类解析jQuery选择器
2016/11/23 Javascript
jQuery animate()实现背景色渐变效果的处理方法【使用jQuery.color.js插件】
2017/03/15 Javascript
JS判断非空至少输入两个字符的简单实现方法
2017/06/23 Javascript
JS实现仿UC浏览器前进后退效果的实例代码
2017/07/17 Javascript
基于js中style.width与offsetWidth的区别(详解)
2017/11/12 Javascript
使用classList来实现两个按钮样式的切换方法
2018/01/24 Javascript
node puppeteer(headless chrome)实现网站登录
2018/05/09 Javascript
vue路由事件beforeRouteLeave及组件内定时器的清除方法
2018/09/29 Javascript
微信小程序发送短信验证码完整实例
2019/01/07 Javascript
利用webpack理解CommonJS和ES Modules的差异区别
2020/06/16 Javascript
微信小程序整个页面的自动适应布局的实现
2020/07/12 Javascript
基于vuex实现购物车功能
2021/01/10 Vue.js
[01:39]2014DOTA2国际邀请赛 Newbee经理CU专访队伍火力全开
2014/07/15 DOTA
在Python的Django框架下使用django-tagging的教程
2015/05/30 Python
Python中遍历字典过程中更改元素导致异常的解决方法
2016/05/12 Python
python运行其他程序的实现方法
2017/07/14 Python
DataFrame中去除指定列为空的行方法
2018/04/08 Python
使用Python操作ArangoDB的方法步骤
2020/02/02 Python
python 使用while循环输出*组成的菱形实例
2020/04/12 Python
Python如何脚本过滤文件中的注释
2020/05/27 Python
Python爬虫HTPP请求方法有哪些
2020/06/03 Python
从Pytorch模型pth文件中读取参数成numpy矩阵的操作
2021/03/04 Python
学生党员思想汇报范文
2014/01/09 职场文书
学习方法演讲稿
2014/05/10 职场文书
教师节宣传方案
2014/05/23 职场文书
医院病假条怎么写
2015/08/17 职场文书
浅谈MySQL next-key lock 加锁范围
2021/06/07 MySQL
React 高阶组件HOC用法归纳
2021/06/13 Javascript
CSS3中Animation实现简单的手指点击动画的示例
2021/07/15 HTML / CSS