reactjs datepicker日期格式

Posted 2023-05-07

【中文标题】reactjs datepicker日期格式

【英文标题】：reactjs datepicker date format

【发布时间】：2019-08-11 18:26:32

【问题描述】：

ReactJS 初学者，我现在使用很棒的 ReactJS Datepicker。关于我的自定义日期格式的问题：

我发现没有文档可以解释所有可能性，例如 M 是月份，MM 是 2 个字母的月份等（我应该查看 github 代码吗？哪个来源？） 如何添加一天的名称...比如星期六。我试过 dddd 但它显示的日期前有 2 个前导 0 ！！ 如何排除非办公时间（如 0 到 8 和 20 到 23 小时），我尝试了下面的 excludesTimes 但没有办法。

这是我的代码：

<DatePicker
    selected=this.state.startDate
    onChange=this.handleChange
    locale=fr
    showTimeSelect
    timeFormat="HH:mm"
    timeIntervals=60
    dateFormat="dddd, DDD, ddd, d, dd MMMM yyyy à HH'h'mm"
    timeCaption="Heure"
    minDate=new Date()
    showDisabledMonthNavigation
    placeholderText="Choisir ici ..."
    excludeTimes=[0, 1, 2, 3, 4]
/>

输入字段中显示的日期是：

0023, 082, 023, 23, 23 mar 2019 à 20h00

谢谢

【问题讨论】：

rezvani-datepicker 返回实际的 new Date() 以便您可以将格式更改为您想要的任何格式。 github.com/Abolfazl2647/rn-datepicker

【参考方案1】：

React datepicker 使用 Moment.js 作为日期，我认为您应该查看his website 的文档。

例如，MMMM Do YYYY, h:mm:ss a 应返回格式为 March 21st 2019, 8:50:37 am 的日期。

编辑

我去了 repo，似乎作者从包中删除了时刻，所以我尝试了找到 here 的格式化日期指南，它似乎现在可以工作了！例如，如果您想要一周中的哪一天，请使用“eeee”。

我在codesandbox 做了一个工作示例。

【讨论】：

感谢您的帮助，但它没有解决.. 使用 dateFormat="MMMM Do YYYY, h:mm:ss a" ，它显示“2019 年 3 月 81 日，晚上 8:43:14” ..而我按照您的要求运行“npm install moment..您能提供更多线索吗？

我去了 repo，似乎作者删除了那一刻，所以我尝试了找到 here 的格式化日期指南，它现在似乎正在工作！例如，如果您想要星期几，请使用“eeee”。我在codesandbox 为你做了一个工作示例。

PERFECT，你解决它！可惜必须看代码才能理解软件的使用..但这就是现在的生活！我们可以将此票标记为已解决（注意解决方案在前面的评论中，而不是关于 moment.js 的答案的开头）。

糟糕的文档库是一场瘟疫...如果您想将其标记为已批准的解决方案，我编辑了答案:)

来自@PabloHuetCarrasco 的链接已过时。作者使用format from date-fns package

【参考方案2】：

您也可以手动转换...

  const convertDate = str => 
  str = str.toString();
  let parts = str.split(" ");
  let months = 
    Jan: "01",
    Feb: "02",
    Mar: "03",
    Apr: "04",
    May: "05",
    Jun: "06",
    Jul: "07",
    Aug: "08",
    Sep: "09",
    Oct: "10",
    Nov: "11",
    Dec: "12"
  ;
  return parts[3] + "-" + months[parts[1]] + "-" + parts[2];
;

:) 重新发明***