vue 日期字符串轉爲剛剛、1分鐘前、1小時前、1天前、1周前、1月前

<template>
  <div></div>
</template>

<script>
import { formatDate } from '@/common/date.js';
export default {
  mounted () {
    this.test();
  },
  methods: {
    test() {
      let str = '2020-01-14 14:02:23';
      let str1 = '2020-01-14 13:02:23';
      let str2 = '2020-01-13 14:02:23';
      let str3 = '2020-01-07 14:02:23';
      let str4 = '2019-12-07 14:02:23';
      let str5 = '2018-12-07 14:02:23';
      // formatDate接收參數爲時間戳,需要將日期字符串轉爲時間戳
      console.log(formatDate(Date.parse(str)));
      console.log(formatDate(Date.parse(str1)));
      console.log(formatDate(Date.parse(str2)));
      console.log(formatDate(Date.parse(str3)));
      console.log(formatDate(Date.parse(str4)));
      console.log(formatDate(Date.parse(str5)));
    }
  }
};
</script>

在這裏插入圖片描述

/**
 * @desc 格式化日期字符串
 * @param { Nubmer} - 時間戳
 * @returns { String } 格式化後的日期字符串
 */
export function formatDate(timestamp) {
  // 補全爲13位
  let arrTimestamp = (timestamp + '').split('');
  for (let start = 0; start < 13; start++) {
    if (!arrTimestamp[start]) {
      arrTimestamp[start] = '0';
    }
  }
  timestamp = arrTimestamp.join('') * 1;
  let minute = 1000 * 60;
  let hour = minute * 60;
  let day = hour * 24;
  let month = day * 30;
  let now = new Date().getTime();
  let diffValue = now - timestamp;
  // 如果本地時間反而小於變量時間
  if (diffValue < 0) {
    return '不久前';
  }
  // 計算差異時間的量級
  let monthC = diffValue / month;
  let weekC = diffValue / (7 * day);
  let dayC = diffValue / day;
  let hourC = diffValue / hour;
  let minC = diffValue / minute;
  // 數值補0方法
  let zero = function (value) {
    if (value < 10) {
      return '0' + value;
    }
    return value;
  };
  // 使用
  if (monthC > 4) {
    // 超過1年,直接顯示年月日
    return (function () {
      let date = new Date(timestamp);
      return date.getFullYear() + '年' + zero(date.getMonth() + 1) + '月' + zero(date.getDate()) + '日';
    })();
  } else if (monthC >= 1) {
    return parseInt(monthC) + '月前';
  } else if (weekC >= 1) {
    return parseInt(weekC) + '周前';
  } else if (dayC >= 1) {
    return parseInt(dayC) + '天前';
  } else if (hourC >= 1) {
    return parseInt(hourC) + '小時前';
  } else if (minC >= 1) {
    return parseInt(minC) + '分鐘前';
  }
  return '剛剛';
}
發佈了35 篇原創文章 · 獲贊 99 · 訪問量 7萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章