从 react-intl 中提取日期格式

Question

我有一个使用日期选择器的组件。 datepicker 需要一个适合 momentjs 模式的 dateFormat 属性，例如 'DD.MM.YYYY' 或 'MM/DD/YYYY'。

日期格式由react-intl 处理。从日期转换为字符串（通过 formatDate）时，这可以正常工作。但是，我需要如上所述检索模式。

我的目标是做类似的事情

dateFormat = this.props.intl.extractDateFormat() // returns 'DD.MM.YYYY'

我找到了this similar question，但唯一的答案是解析字符串，我不能这样做，因为我不知道在格式化的日期中是Day还是Month。

如果可以将此字符串转换为日期并以某种方式从momentjs 检索格式，那也是一个很好的解决方案。

Answer 1

我能够从 react-intl 获取日期格式。为此，我定义了一个示例日期，并通过 react-intl 对其进行格式化，然后通过引用原始字符串来解析格式。

导出为injectIntl(Component) 的组件有这个方法：

deriveDateFormat = () => {
  const isoString = '2018-09-25' // example date!

  const intlString = this.formatDate(isoString) // generate a formatted date
  const dateParts = isoString.split('-') // prepare to replace with pattern parts

  return intlString
    .replace(dateParts[2], 'DD')
    .replace(dateParts[1], 'MM')
    .replace(dateParts[0], 'YYYY')
}

日期将例如格式化为“09/25/2018”，此函数将返回“MM/DD/YYYY”，这是 Moment.js 可以使用的格式。
仅当您知道月份和日期将始终以两位数显示时，此功能才有效。如果格式类似于 2018 年 9 月 25 日，它将失败。

我还没有找到直接从 react-intl 中提取日期格式的方法。