moment.js 格式化显示时间差

Posted 2023-05-04

参考技术A moment.js 格式化显示时间差

项目中有个字段需要计算两个时间的时间差，并且按照 x天 x 小时 x 分钟 显示，如

之前已经在项目中引入了 moment.js ，接下来用其中的一些方法封装一个可以得到目标字符串的函数。

使用 Moment.js 格式化日期

【中文标题】使用 Moment.js 格式化日期

【英文标题】：Format date with Moment.js

【发布时间】：2013-04-06 07:29:24

【问题描述】：

我有一个这种格式的字符串：

var testDate = "Fri Apr 12 2013 19:08:55 GMT-0500 (CDT)"

我想用Moment.js获取这个格式mm/dd/yyyy : 04/12/2013来显示。

我试过用这种方法来做，

moment(testDate,'mm/dd/yyyy');

哪些错误并显示there is no such method called replace？我是否以错误的方式处理这个问题？

---

编辑

我还应该提到，我使用的是 Moment.js 的预打包版本，为 Meteor.js

打包

Object [object Date] has no method 'replace' : The Exact error from the console

堆栈跟踪：

 at makeDateFromStringAndFormat (http://127.0.0.1:3000/packages/moment/lib/moment/moment.js?b4e3ac4a3d0794023a4410e7941c3e179398b5b0:539:29)
    at moment (http://127.0.0.1:3000/packages/moment/lib/moment/moment.js?b4e3ac4a3d0794023a4410e7941c3e179398b5b0:652:24)
    at populateProfileForEdit (http://127.0.0.1:3000/client/views/home/administration/directory/profiles/profiles.js?acfff908a6a099f37312f62892a22b40f82e5e0f:147:25)
    at Object.Template.profile_personal.rendered (http://127.0.0.1:3000/client/views/home/administration/directory/profiles/profiles.js?acfff908a6a099f37312f62892a22b40f82e5e0f:130:13)
    at Spark.createLandmark.rendered (http://127.0.0.1:3000/packages/templating/deftemplate.js?b622653d121262e50a80be772bf5b1e55ab33881:126:42)
    at http://127.0.0.1:3000/packages/spark/spark.js?45c746f38023ceb80745f4b4280457e15f058bbc:384:32
    at Array.forEach (native)
    at Function._.each._.forEach (http://127.0.0.1:3000/packages/underscore/underscore.js?867d3653d53e9c7a171483edbcad9670e12288c7:79:11)
    at http://127.0.0.1:3000/packages/spark/spark.js?45c746f38023ceb80745f4b4280457e15f058bbc:382:7
    at _.extend.flush (http://127.0.0.1:3000/packages/deps/deps.js?9642a93ae1f8ffa8eb1c2475b198c764f183d693:231:11) 

【问题讨论】：

您在代码中使用replace() 吗？如果不是，则您使用的插件不恰当地调用了不存在的方法。

我已经用调用“替换”的方法更新了我的问题，其中包含确切的错误和堆栈跟踪。我根本没有直接调用替换

【参考方案1】：

moment() 的第二个参数是 parsing format，而不是 display 格式。

为此，您需要.format() method：

moment(testDate).format('MM/DD/YYYY');

还要注意大小写很重要。对于月份、月份和年份，格式应为大写。

【讨论】：

优秀。我最初尝试像这样使用它moment().format()，但失败了。谢谢

var obj = end_date: moment($scope.activity.endDate).format('MM/DD/YYYY');

@MichaelCalkins 对不起。那是做什么用的？而且，为什么还要额外引用 AngularJS ($scope)？

@JonathanLonowski 这可以是任何变量。我碰巧正在编程并寻找这个答案。只是一个例子。

每当我使用格式时，我都无法调用 date() 。所以我不得不使用某种子字符串结构来从（“DD-MM-YYYY”）格式中获取这一天。

【参考方案2】：

包含 moment.js 并使用以下代码格式化您的日期

var formatDate= 1399919400000;

var responseDate = moment(formatDate).format('DD/MM/YYYY');

我的输出是“13/05/2014”

【讨论】：

我怎样才能扭转这种局面？我的意思是如果我有后一种格式并想将其更改为第一种格式。

@ArslanTariq 你可以使用momentObject.valueOf() 来获取纪元的毫秒数。

【参考方案3】：

moment().format();                                // "2019-08-12T17:52:17-05:00" (ISO 8601, no fractional seconds)
moment().format("dddd, MMMM Do YYYY, h:mm:ss a"); // "Monday, August 12th 2019, 5:52:00 pm"
moment().format("ddd, hA");                       // "Mon, 5PM"

【讨论】：

如果您解释了如何此代码解决了 OP 的问题，将会有所帮助。

【参考方案4】：

你可能不再需要 Moment.js

Moment 是一个很棒的时间操纵库，但它被认为是一个遗留项目，团队建议使用其他libraries。

date-fns 是最好的轻量级库之一，它是模块化的，因此您可以选择所需的功能并减小包大小（issue 和statement）。

反对在现代应用程序中使用 Moment 的另一个常见论点是它的大小。 Moment 不适用于现代“摇树”算法，因此它往往会增加 Web 应用程序包的大小。

import  format  from 'date-fns' // 21K (gzipped: 5.8K)
import moment from 'moment' // 292.3K (gzipped: 71.6K)

用date-fns格式化日期：

// moment.js
moment().format('MM/DD/YYYY');
// => "12/18/2020"

// date-fns
import  format  from 'date-fns'
format(new Date(), 'MM/dd/yyyy');
// => "12/18/2020"

有关备忘单的更多信息以及可用于替换 moment.js 的函数列表：You-Dont-Need-Momentjs

【参考方案5】：

对于开始输出日期，请使用format。第二个时刻参数用于解析 - 但是如果你省略它，那么你 testDate 将导致弃用警告

弃用警告：提供的值不是可识别的 RFC2822 或 ISO 格式...

var testDate= "Fri Apr 12 2013 19:08:55 GMT-0500 (CDT)"

let s= moment(testDate).format('MM/DD/YYYY');

msg.innerText= s;

<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/moment.min.js"></script>

<div id="msg"></div>

要省略此警告，您应该提供解析格式

var testDate= "Fri Apr 12 2013 19:08:55 GMT-0500 (CDT)"

let s= moment(testDate, 'ddd MMM D YYYY HH:mm:ss ZZ').format('MM/DD/YYYY');

console.log(s);

<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/moment.min.js"></script>

【讨论】：

太好了，首先我必须提供我们的日期格式的标识符（格式），然后是所需的格式。很好的例子。

【参考方案6】：

var moment = require('moment');

let yourdate = '2021-01-02T07:57:45.121Z'; // for example

moment(yourdate).format('MM/DD/YYYY');

// output : 01-02-2021


moment(yourdate).format('DD-MMM-YYYY');

// output : 01-Jan-2021

【参考方案7】：

这可能有助于一些人愿意或意外地一个接一个地寻找多种日期格式。 请找到代码： 我在当前日期使用 moment.js 格式函数（今天是 29-06-2020） var startDate = moment(new Date()).format('MM/DD/YY');结果：20 年 6 月 28 日

如果我运行以下语句，它只保留年份部分：20 为“06/28/20”： 新日期（开始日期） 结果是“Mon Jun 28 1920 00:00:00 GMT+0530（印度标准时间）”，

然后，当我在“06/28/20”上使用另一种格式时： startDate = moment(startDate ).format('MM-DD-YYYY');结果：06-28-1920，在 google chrome 和 firefox 浏览器中，第二次尝试的正确日期为：06-28-2020。但是在 IE 中存在问题，据我了解，我们可以在给定日期应用一个日期格式，如果我们想要第二个日期格式，它应该应用于新日期而不是第一个日期格式结果。 并且还观察到第一次应用 'MM-DD-YYYY' 和下一个 'MM-DD-YY' 在 IE 中工作。 为了清楚理解，请在链接中找到我的问题： Date went wrong when using Momentjs date format in IE 11

【参考方案8】：

您可以将“L”传递给处理国际化的format 方法...

moment.locale('en-US');
moment().format("L");
> "06/23/2021"

moment.locale('fr');
moment().format("L");
> "23/06/2021"

其他长日期格式（fr locale）：

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