Moment与Date-fns的本地日期格式化区别

17
我将为您翻译以下内容:

我正在评估DateFns和Moment在我们应用程序的上下文中,发现了一个在DateFns中似乎很重要的遗漏。

在Moment中,本地化支持允许您格式化日期或时间的本地化正确表示。例如,日期格式“LL”和“L”将为英语区域设置产生以下结果:

November 27, 2017
11/27/2017

以下是西班牙语区域的内容:

27 de noviembre de 2017
27/11/2017

请注意,第二个示例中,英语中月份在日期之前,而西班牙语中日期在月份之前。这正是您希望区域设置代码为您处理的内容。这就是几乎所有日期时间库(C++、C#、Java、Python等)中区域设置的工作方式。
在DateFns中,似乎没有适用于本地化正确的长日期、短日期、时间等的格式选项。他们提供的使用区域设置的示例需要您传递区域设置特定的格式字符串:
// Represent 2 July 2014 in Esperanto:
var eoLocale = require('date-fns/locale/eo')
var result = format(
  new Date(2014, 6, 2),
  'Do [de] MMMM YYYY',
  {locale: eoLocale}
)

换句话说,我需要了解我支持的每个语言环境的日期/时间格式,这违背了首先拥有语言环境支持的目的。
我可以使用JavaScript的toLocaleString,但那样我的应用程序就要以两种不同的方式管理语言环境。
有没有某种方法可以打印出特定语言环境的“短日期”,而无需告诉DateFns该语言环境的格式?

它应该在date-fns@2.0.0中可用(尚未发布,正在进行alpha-7版本)https://date-fns.org/v2.0.0-alpha.7/docs/format - Flo Schild
也许你可以使用 https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/DateTimeFormat 作为一种替代方案。 - darmis
2个回答

13

我使用 date-fns 的 esm 版本,你可以使用与 moment 相同类型的格式:

import { format } from 'date-fns/esm'
import { enUS, fr } from 'date-fns/esm/locale'

我将把区域设置存储在一个对象中:

this.dateLocales = { fr: fr, en: enUS }

并使用这些格式:

LT: 'h:mm aa',
LTS: 'h:mm:ss aa',
L: 'MM/DD/YYYY',
LL: 'MMMM D YYYY',
LLL: 'MMMM D YYYY h:mm aa',
LLLL: 'dddd, MMMM D YYYY h:mm aa'

所以你可以做:

format(
  new Date(2014, 6, 2),
  'LL',
  {locale: this.dateLocales.fr}
)

这些格式是本地化的


嘿@Lakston,感谢你的提示,你的答案似乎使用了字符串而不是常量,这是有意为之吗?你能解释一下不同格式是如何定义的吗? - Flo Schild
你说得对,我忘了指定我有一个用于存储地区设置的对象,我传递的不是字符串而是对我的导入的引用,我会更新我的答案,如果不够清楚请随时要求更多信息。 - Lakston
我只是好奇,但我认为这个答案仍然可以对一些人有所帮助,直到date-fns@2.0.0发布为止 :) - Flo Schild
我的答案适用于 2.0.0 alpha 版本,因此当官方发布 RC 版本时,您不需要更改任何或很少的代码 ;) - Lakston

7
截至2021年,使用当前最新版本的date-fns(v2.23.0),您可以通过使用“P”格式来实现所需功能。
请参见:https://date-fns.org/v2.23.0/docs/format 例如,假设今天是2021-08-27(ISO日期):
import { format } from 'date-fns';
import ptBrLocale from 'date-fns/locale/pt-BR';
import enUsLocale from 'date-fns/locale/en-US';

console.log(format(new Date(), 'P', { locale: ptBrLocale }));
console.log(format(new Date(), 'P', { locale: enUsLocale }));

输出将为:

27/08/2021
08/27/2021

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接