Flatpickr 和 Moment.js 意外的日期格式答案

【问题标题】：Flatpickr and Moment.js unexpected date formatFlatpickr 和 Moment.js 意外的日期格式
【发布时间】：2017-10-13 12:27:08
【问题描述】：

我正在为 Flatpickr 使用以下实例化代码。

$("#entry_date_time").flatpickr({
    enableTime: true,
    altInput: true,
    defaultDate: moment().format("YYYY-MM-DD HH:MM:SS"),
    dateFormat: "YYYY-MM-DD HH:MM:SS",
    minuteIncrement: 1
});

我遇到的问题是 moment().format("YYYY-MM-DD HH:MM:SS"); 给了我正确的数据，但 $("#entry_date_time").val() 的输出等于

2017201720172017-JanJan-SatSat 0000:JanJan:0000

而不是我提供的预期格式。

任何关于可能导致此问题的想法都会很棒，感谢您的帮助！

【问题讨论】：

标签： date datetime timestamp momentjs flatpickr

【解决方案1】：

Flatpickr 有自己的formating tokens，与 moment 支持的不同。但好在您可以使用 parseDate 和 formatDate 配置选项来支持自定义格式标记。

/* A custom datestring parser */
parseDate: (date: string, format: string) => Date;

/* Allows using a custom date formatting function instead of the built-in. Generally unnecessary.  */
formatDate: (date: Date, format: string, locale: Locale) => string;

moment.js 兼容令牌示例 https://jsfiddle.net/armujahid/pwqhznj0/

const fp = flatpickr(".date", {
  altInput: true,
  dateFormat: "YYYY-MM-DD",
  altFormat: "DD-MM-YYYY",
  allowInput: true,
  parseDate: (datestr, format) => {
    return moment(datestr, format, true).toDate();
  },
  formatDate: (date, format, locale) => {
    // locale can also be used
    return moment(date).format(format);
  }
});

参考：我在https://github.com/flatpickr/flatpickr/issues/1549#issuecomment-537939826的评论

更新：这个sn-p也被添加到official docs

【讨论】：

【解决方案2】：

根据输出，并查看 date 和 time 的 flatpickr 文档，似乎格式中只需要单个字符而不是多个 ?例如，4 Y 可以解释年份重复 4 次、月份重复 2 次等。

您需要的日期格式应该是：

dateFormat: "Y-M-D H:i"

...但是，我确实没有看到 flatpickr 的秒部分的格式选项？

秒更新：

秒功能有一个flatpickr feature request。

【讨论】：