網站搜尋

javascript - 使用 MomentJS 的明天、今天與昨天


我想要 moment().fromNow() 的功能,但當日期很接近時,它太精確了——例如,我不想顯示「3小時後」,而是「今天」——所以基本上是以「每日」的精度。

我嘗試使用 moment().calendar() 函數,如果日期差異超過一天,它不會進行格式化

答案#1

你也可以這樣來獲取今天、明天和昨天的日期

let today     = moment();

let tomorrow  = moment().add(1,'days');

let yesterday = moment().add(-1, 'days');

答案#2

我使用 add() 和 endOf() 與 moment 的組合

//...
const today = moment().endOf('day')
const tomorrow = moment().add(1, 'day').endOf('day')

if (date < today) return 'today'
if (date < tomorrow) return 'tomorrow'
return 'later'
//...

[編輯 2022-01-04] 我建議你現在使用 dayjs,它擁有與 moment 完全相同的 API,且輕量 ;)

答案#3

您可以使用 moment.updateLocale 自訂 .fromNow 和 .calendar 方法顯示日期的方式。以下程式碼將根據問題更改 .calendar 的顯示方式:

moment.updateLocale('en', {
    calendar : {
        lastDay : '[Yesterday]',
        sameDay : '[Today]',
        nextDay : '[Tomorrow]',
        lastWeek : '[Last] dddd',
        nextWeek : '[Next] dddd',
        sameElse : 'L'
    }
});

根據這個問題,看起來 .calendar 方法會比較合適——.fromNow 想要的是一個過去/現在的前綴或後綴,但如果你想了解更多,可以閱讀文件:http://momentjs.com/docs/#/customization/relative-time/。

要只在一個地方使用這個方法,而不是覆蓋語系,請在定義 moment.updateLocale 時將你選擇的字串作為第一個參數,然後使用該語系調用 calendar 方法(例如 moment.updateLocale('yesterday-today').calendar( /* moment() 或其他 */ ))

編輯:Moment ^2.12.0 現在有 updateLocale 方法。updateLocale 和 locale 似乎在功能上相同,而 locale 尚未被廢棄,但已更新答案以使用較新的方法。

答案#4

要求:

  • 當日期較遠時,使用標準的 moment().fromNow() 功能。
  • 當日期接近時,顯示 "今天"、"昨天"、"明天" 等。

解決方案:

// call this function, passing-in your date
function dateToFromNowDaily( myDate ) {

    // get from-now for this date
    var fromNow = moment( myDate ).fromNow();

    // ensure the date is displayed with today and yesterday
    return moment( myDate ).calendar( null, {
        // when the date is closer, specify custom values
        lastWeek: '[Last] dddd',
        lastDay:  '[Yesterday]',
        sameDay:  '[Today]',
        nextDay:  '[Tomorrow]',
        nextWeek: 'dddd',
        // when the date is further away, use from-now functionality             
        sameElse: function () {
            return "[" + fromNow + "]";
        }
    });
}

注意:從版本 2.14.0 起,calendar 函數的 formats 參數可以是一個回調函數,詳情請參見 http://momentjs.com/docs/#/displaying/calendar-time/。

答案#5

你可以使用這個:

const today     = moment();

const tomorrow  = moment().add(1, 'days');

const yesterday = moment().subtract(1, 'days');

答案#6

這是我使用 moment 來做這件事的方式:

  let today = moment().format('DD MMMM YYYY');

  let tomorrow = moment().add(1, 'days').format('DD MMMM YYYY').toString();

  let yesterday = moment().subtract(1, 'days').startOf('day').format('DD MMMM YYYY').toString();

答案#7

我有類似的解決方案,但允許使用本地化設定:

    let date = moment(someDate);
    if (moment().diff(date, 'days') >= 2) {
        return date.fromNow(); // '2 days ago' etc.
    }
    return date.calendar().split(' ')[0]; // 'Yesterday', 'Today', 'Tomorrow'

答案#8

從 2.10.5 開始,moment 支援在每次調用時指定日曆輸出格式。欲獲取更詳細的文檔,請查看 Moment - Calendar。

**Moment 2.10.5**
moment().calendar(null, {
  sameDay: '[Today]',
  nextDay: '[Tomorrow]',
  nextWeek: 'dddd',
  lastDay: '[Yesterday]',
  lastWeek: '[Last] dddd',
  sameElse: 'DD/MM/YYYY'
});

從 2.14.0 版本開始,日曆也可以使用回調來返回值。

**Moment 2.14.0**
    moment().calendar(null, {
     sameDay: function (now) {
       if (this.isBefore(now)) {
         return '[Will Happen Today]';
       } else {
        return '[Happened Today]';
       }
       /* ... */
      }
    });

答案#9

在 Moment.js 中,from() 方法具有你正在尋找的每日精確度:

var today = new Date();
var tomorrow = new Date();
var yesterday = new Date();
tomorrow.setDate(today.getDate()+1);
yesterday.setDate(today.getDate()-1);

moment(today).from(moment(yesterday)); // "in a day"
moment(today).from(moment(tomorrow)); // "a day ago" 

moment(yesterday).from(moment(tomorrow)); // "2 days ago" 
moment(tomorrow).from(moment(yesterday)); // "in 2 days"