時間格式化，顯示昨天、今天

甜點cc發表於2023-04-26

時間格式化的需求：

  • 今天的資料顯示“時分”，HH:mm 10:00
  • 昨天的資料顯示“昨天 時分”， 昨天 10:00
  • 今年的資料，顯示 “月日 時分”， 05-01 10:00
  • 不是今年的資料，顯示“年月日 時分”， 2022-05-01 10:00

程式碼展示

在 ios中 用new Date("2022-05-01 10:00").getTime()會有相容性問題，跟日期格式的連字元有關係，這裡使用moment外掛

const moment = require("moment");

// 判斷日期是不是今天、昨天， 0:今天 -1:昨天 1-明天
// str: 2023-02-07 14:09:27.0
export function isWhichDay(str) {
  const date = new Date();
  const that = moment(moment(str).format("YYYY-MM-DD")).valueOf();
  const today = moment(moment(date).format("YYYY-MM-DD")).valueOf();
  const timeStampDiff = that - today;
  const obj = {
    "-86400000": "-1",
    0: "0",
    86400000: "1",
  };
  return obj[timeStampDiff] || null;
}

// 判斷是不是當年
export function isCurYear(str) {
  return moment().format("YYYY") === moment(str).format("YYYY");
}

/**
 * 格式化時間 YYYY-MM-DD HH:mm:ss
 * 1、當天時間顯示如 10:00
 * 2、昨天顯示如 昨天10:00
 * 3、昨天之前且當年的，顯示如，05-01 10:00
 * 4、昨天之前且跨年的，顯示如， 2022-05-01 10:00
 * @param {string} time  "2022-05-01 10:00:01.0"
 * @returns {string}
 */
export function formatTime(time) {
  const t = isWhichDay(time);
  if (t === "0") {
    return moment(time).format("HH:mm");
  } else if (t === "-1") {
    return `昨天 ${moment(time).format("HH:mm")}`;
  } else if (
    isCurYear(time) &&
    moment(time).valueOf() < moment(new Date()).valueOf()
  ) {
    return moment(time).format("MM-DD HH:mm");
  } else {
    return moment(time).format("YYYY-MM-DD HH:mm");
  }
}

我是 甜點cc☭

公眾號：【看見另一種可能】

相關文章