zoukankan      html  css  js  c++  java
  • JS 时间转化为几分钟前 几小时前 几天前

    背景:最近公司要做动态列表,类似于微信朋友圈。动态创建时间就需要显示为 刚刚、几分钟前、几小时前、几天前、2018-05-15,这样的形式。

    代码如下

        var minute = 1000 * 60;
        var hour = minute * 60;
        var day = hour * 24;
    
        // 计算时间差
        handleDate(minute, hour, day,dateTimeStamp) {
          var result = '';
          var now = new Date().getTime();
          var diffValue = now - dateTimeStamp;
          if (diffValue < 0) {
            console.log("时间不对劲,服务器创建时间与当前时间不同步");
            return result = "刚刚";
          }
          var dayC = diffValue / day;
          var hourC = diffValue / hour;
          var minC = diffValue / minute;
          if (parseInt(dayC) > 30) {
            result = "" + this.$format(dateTimeStamp,"yyyy-MM-dd");
          }else if(parseInt(dayC) > 1) {
            result = "" + parseInt(dayC) + "天前";
          }else if (parseInt(dayC) == 1) {
            result = "昨天";
          } else if (hourC >= 1) {
            result = "" + parseInt(hourC) + "小时前";
          } else if (minC >= 5) {
            result = "" + parseInt(minC) + "分钟前";
          } else
            result = "刚刚";
          return result;
        },

    参数 dateTimeStamp 为服务器返回的创建时间 ;

    因为服务器并没有返回当前时间,所以有时候时间会出现小小的偏差,但是没关系,显示为刚刚就行了。

     * this.$format() 为处理时间的方法;

     1 /**
     2  * 格式化时间
     3  * @param date Date 时间
     4  * @param format 格式化 "yyyy-MM-dd hh:mm:ss www"=format
     5  * @returns {string} 格式化后字符串
     6  */
     7 
     8 export function format(date, format){
     9   if (typeof date == 'string') {
    10     if(date.indexOf('T')>=0){
    11       date = date.replace('T',' ')
    12     }
    13     date = new Date(Date.parse(date.replace(/-/g, "/")))
    14   }
    15   var o = {
    16       "M+": date.getMonth() + 1,
    17       "d+": date.getDate(),
    18       "h+": date.getHours(),
    19       "m+": date.getMinutes(),
    20       "s+": date.getSeconds(),
    21       "q+": Math.floor((date.getMonth() + 3) / 3),
    22       "S": date.getMilliseconds()
    23   };
    24   var w = [
    25       ['日', '一', '二', '三', '四', '五', '六'],
    26       ['周日', '周一', '周二', '周三', '周四', '周五', '周六'],
    27       ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六']
    28   ];
    29   if (/(y+)/.test(format)) {
    30       format = format.replace(RegExp.$1, (date.getFullYear() + "").substr(4 - RegExp.$1.length));
    31   }
    32   if (/(w+)/.test(format)) {
    33       format = format.replace(RegExp.$1, w[RegExp.$1.length - 1][date.getDay()]);
    34   }
    35   for (var k in o) {
    36       if (new RegExp("(" + k + ")").test(format)) {
    37           format = format.replace(RegExp.$1, RegExp.$1.length == 1 ? o[k] : ("00" + o[k]).substr(("" + o[k]).length));
    38       }
    39   }
    40   return format;
    41 }
    View Code
  • 相关阅读:
    解析数据库xml格式字段
    Spring切面表达式,hibernate,struts
    常见枚举
    经典冒泡排序,九九乘法表,三角形
    拦截器后台安全验证
    Oracle 将表中多条数据同一字段拼成一列显示
    idea 11 控制台日志乱码
    BigDecimal 分转元,元转分
    currtDownLatch可能会出现的三个问题
    CountDownLatch用法
  • 原文地址:https://www.cnblogs.com/wyhlightstar/p/9347196.html
Copyright © 2011-2022 走看看