需要开发一个需求,在项目的评论列表需要显示追评的时间离第一次评论时间的时间差。以下后端接口返回的数据,需要前端进行在处理。
在这里插入图片描述
想到的思路是先把具体日期转为时间戳再换算成天,时,分,秒各个单位,因为是用vue开发,所以直接用过滤器filters操作

<text  class="createdTimer">用户{{row.content_append_time | aboutDay(row.content_time)}}后追加评论</text>
/**
       * 具体时间转为时间戳再换算成天,时,分,秒显示
       * @param {string} newDate  追评时间
       * @param {string} agoDate  第一评论时间
       */
      aboutDay(newDate,agoDate){
      	//转换成时间戳
        let newTimer = new Date(newDate).getTime()/1000;
        let agoTimer = new Date(agoDate).getTime()/1000;
        //获取之间的时间戳差值
        let useDay = newTimer - agoTimer;
        //对差值进行换算,得到相应的单位
        let day = Math.floor(useDay/86400);
        let hour  = Math.floor(useDay%86400/3600);
        let minute  = Math.floor(useDay%86400%3600/60);
        let second  = Math.floor(useDay%86400%3600%60);
        if(day){
          return day +'天';
        }else if(hour){
          return hour + '小时';
        }else if(minute){
          return minute + '分钟';
        }else{
          return second + '秒';
        }
      },

最终得到的效果
在这里插入图片描述
当然,以上js代码还可以优化,可以使用两个时间的差值useDay进行判断再做对应的换算操作,不过那是后话了。

Logo

前往低代码交流专区

更多推荐