如何自定义date-fns的formatRelative?
How to customize date-fns's formatRelative?
瞬间,有了calendar,我可以自定义如何显示时间,如下所示
moment(dateTime).calendar(null, {
sameDay: '[Today]',
nextDay: '[Tomorrow]',
nextWeek: 'dddd',
lastDay: '[Yesterday]',
lastWeek: '[Last] dddd',
sameElse: 'DD/MM/YYYY'
});
在date-fns中,基于formatRelative,我可以提供options
.
formatRelative(dateTime, Date.now(), options);
但是看了options
文档,还是想不通怎么自定义。
任何指南都会有所帮助。谢谢
尽管 date-fns 不支持本地方法进行部分覆盖(目前),您可以执行以下操作,进行一些手动调整(此处显示为德语语言环境):
import { formatRelative } from 'date-fns';
import { de } from 'date-fns/esm/locale';
const formatRelativeLocale = {
lastWeek: '[letzten] dddd [um] LT',
yesterday: '[gestern um] LT',
today: '[heute um] LT',
tomorrow: '[morgen um] LT',
nextWeek: 'dddd [um] LT',
other: 'L LT', // Difference: Add time to the date
};
const locale = {
...de,
formatRelative: token => formatRelativeLocale[token],
};
const text = formatRelative(date, new Date(), { locale });
已接受答案的更新:在最新版本的 date-fns
中,格式字符串看起来略有不同(单引号而不是大括号):
import { formatRelative } from 'date-fns';
import { de } from 'date-fns/esm/locale';
const formatRelativeLocale = {
lastWeek: "'letzten' dddd 'um' LT",
yesterday: "'gestern um' LT",
today: "'heute um' LT",
tomorrow: "'morgen um' LT",
nextWeek: "dddd 'um' LT",
other: 'L LT', // Difference: Add time to the date
};
const locale = {
...de,
formatRelative: token => formatRelativeLocale[token],
};
const text = formatRelative(date, new Date(), { locale });
另见 this example of the format string specified in the date-fns
source。
瞬间,有了calendar,我可以自定义如何显示时间,如下所示
moment(dateTime).calendar(null, {
sameDay: '[Today]',
nextDay: '[Tomorrow]',
nextWeek: 'dddd',
lastDay: '[Yesterday]',
lastWeek: '[Last] dddd',
sameElse: 'DD/MM/YYYY'
});
在date-fns中,基于formatRelative,我可以提供options
.
formatRelative(dateTime, Date.now(), options);
但是看了options
文档,还是想不通怎么自定义。
任何指南都会有所帮助。谢谢
尽管 date-fns 不支持本地方法进行部分覆盖(目前),您可以执行以下操作,进行一些手动调整(此处显示为德语语言环境):
import { formatRelative } from 'date-fns';
import { de } from 'date-fns/esm/locale';
const formatRelativeLocale = {
lastWeek: '[letzten] dddd [um] LT',
yesterday: '[gestern um] LT',
today: '[heute um] LT',
tomorrow: '[morgen um] LT',
nextWeek: 'dddd [um] LT',
other: 'L LT', // Difference: Add time to the date
};
const locale = {
...de,
formatRelative: token => formatRelativeLocale[token],
};
const text = formatRelative(date, new Date(), { locale });
已接受答案的更新:在最新版本的 date-fns
中,格式字符串看起来略有不同(单引号而不是大括号):
import { formatRelative } from 'date-fns';
import { de } from 'date-fns/esm/locale';
const formatRelativeLocale = {
lastWeek: "'letzten' dddd 'um' LT",
yesterday: "'gestern um' LT",
today: "'heute um' LT",
tomorrow: "'morgen um' LT",
nextWeek: "dddd 'um' LT",
other: 'L LT', // Difference: Add time to the date
};
const locale = {
...de,
formatRelative: token => formatRelativeLocale[token],
};
const text = formatRelative(date, new Date(), { locale });
另见 this example of the format string specified in the date-fns
source。