【问题标题】:How do you format a datetime to am/pm, without periods, when using date-fns version 2.x?使用 date-fns 2.x 版时,如何将日期时间格式化为 am/pm,不带句点?
【发布时间】:2020-06-28 21:04:49
【问题描述】:

2.x 版的优秀日期包date-fns 仅具有这些内置的 am/pm 格式。

如何在没有句点的情况下格式化小写 am/pm?

【问题讨论】:

    标签: javascript date-fns


    【解决方案1】:

    -- 适用于 2.23.0 之前的 datefns 版本--

    快速解决方案

    使用aaaaa'm'

    format(new Date(), "YYYY-MM-DD hh:mm aaaaa'm'")
    

    解释: @GollyJer 找到了一种非常聪明的方法来解决这个限制。根据the documentation,我们可以使用aaaaa 生成a(对于AM)或p(对于PM)。然后我们只用转义字符m 跟在它后面,即'm',产生ampm

    注意:如果您允许任何类型的区域切换,这可能会导致错误的输出,因为 AM 和 PM 可能因语言而异。

    其他方式

    不过,对于这些版本,根据文档和源代码审查,没有 native¹ 方式来执行此操作,因为格式取决于源代码中显示的语言环境配置 (@987654322 @):

    // AM or PM
    a: function(date, token, localize) {
      var hours = date.getUTCHours()
      var dayPeriodEnumValue = hours / 12 >= 1 ? 'pm' : 'am'
    
      switch (token) {
        case 'a':
        case 'aa':
        case 'aaa':
          return localize.dayPeriod(dayPeriodEnumValue, {
            width: 'abbreviated',
            context: 'formatting'
      })
      // ...
    

    1:原生,我的意思是一个简单的原生 API 格式化程序。

    您可以add a new locale 自定义字符串。这意味着更改此特定部分(基于locale/en-US/_lib/localize/index.js):

    var formattingDayPeriodValues = {
        // ...
        abbreviated: {
            am: 'AM',
            pm: 'PM',
            // ...
        }
        // ...
    }
    

    很遗憾,这个新版本没有自定义默认语言环境的简单方法,甚至只是应用猴子补丁的简单方法。创建一个新的语言环境一点也不优雅,在调用format 之后手动将a.m. 替换为am 也不是。

    版本 1.x.x 和 2.0.0(alpha/beta)

    对于这些版本,只需使用a 格式。示例:

    console.log(dateFns.format(new Date(), 'YYYY-MM-DD hh:mm a'));
    <script src="https://cdnjs.cloudflare.com/ajax/libs/date-fns/1.30.1/date_fns.min.js"></script>
    <!-- or: https://cdnjs.cloudflare.com/ajax/libs/date-fns/2.0.0-alpha0/date_fns.min.js -->

    你可以自己检查in the source code它的工作方式:

    var meridiemLowercase = [
        'am',
        'pm'
    ];
    
    var formatters = {
        // ...
        'a': function (date) {
            return date.getHours() / 12 >= 1 ? meridiemLowercase[1] : meridiemLowercase[0];
        },
        // ...
    }
    

    【讨论】:

    • 感谢您的回答。我什至没有意识到第 2 版是相当新的。我已经更新了问题以反映新版本,该版本没有您使用 1.x 回答的格式。
    • @GollyJer 编辑了答案。第 2 版对我来说也是新闻。它似乎以相同的方式工作,所以我不知道与文档的处理是什么。 a for am, aa for a.m. and A for AM etc... 编辑:我现在看到有一个 2.11.0 版本但在 CDN 上不可用,我会检查一下并回复您。
    • 我找到了一种使用 2.1+ 的方法。你能更新你的答案,我会接受。谢谢。 format(new Date(), "YYYY-MM-DD hh:mm aaaaa'm'")
    【解决方案2】:

    您现在可以使用 aaa 模式来处理这种情况 (v.2.23.0)

    来源:https://date-fns.org/v2.23.0/docs/format

    【讨论】:

    • 不错!谢谢(你的)信息。我将其更改为已接受的答案。
    猜你喜欢
    • 2021-02-17
    • 2019-01-18
    • 2021-01-29
    • 2021-03-19
    • 1970-01-01
    • 2021-11-14
    • 2020-06-15
    • 1970-01-01
    • 2021-01-23
    相关资源
    最近更新 更多