React实战之将数据库返回的时间转换为几分钟前、几小时前、几天前的形式。

不知道大家的时间格式是什么样子的,我先展示下我这里数据库返回的时间格式

‘2019-05-05T15:52:19Z’

是这个样子的,然后上代码:

在utils文件下创建文件time.js文件

time.js

export default function time(UTCtiem) {
var T_pos = UTCtiem.indexOf('T');
var Z_pos = UTCtiem.indexOf('Z');
var year_month_day = UTCtiem.substr(0, T_pos);
var hour_minute_second = UTCtiem.substr(T_pos + 1, Z_pos - T_pos - 1);
var new_datetime = year_month_day + " " + hour_minute_second; var dateTime = new Date(new_datetime); var no1new = dateTime.valueOf(); var year = dateTime.getFullYear();
var month = dateTime.getMonth() + 1;
var day = dateTime.getDate();
var hour = dateTime.getHours();
var minute = dateTime.getMinutes();
var second = dateTime.getSeconds();
var now = new Date();
var now_new = now.valueOf(); //typescript转换写法 var milliseconds = 0;
var timeSpanStr; milliseconds = now_new - no1new; if (milliseconds <= 1000 * 60 * 1) {
timeSpanStr = '刚刚';
}
else if (1000 * 60 * 1 < milliseconds && milliseconds <= 1000 * 60 * 60) {
timeSpanStr = Math.round((milliseconds / (1000 * 60))) + '分钟前';
}
else if (1000 * 60 * 60 * 1 < milliseconds && milliseconds <= 1000 * 60 * 60 * 24) {
timeSpanStr = Math.round(milliseconds / (1000 * 60 * 60)) + '小时前';
}
else if (1000 * 60 * 60 * 24 < milliseconds && milliseconds <= 1000 * 60 * 60 * 24 * 15) {
timeSpanStr = Math.round(milliseconds / (1000 * 60 * 60 * 24)) + '天前';
}
else if (milliseconds > 1000 * 60 * 60 * 24 * 15 && year == now.getFullYear()) {
timeSpanStr = month + '-' + day + ' ' + hour + ':' + minute;
} else {
timeSpanStr = year + '-' + month + '-' + day + ' ' + hour + ':' + minute;
}
return timeSpanStr; }

  

用法:

先需要import,具体看各位的路径

import time from '../utils/time';    //这里请注意自己的路径

let times = time('2019-06-05T15:32:19Z');

console.log('times',times);

代码就是这样!!!

React实战之将数据库返回的时间转换为几分钟前、几小时前、几天前的形式。的更多相关文章

  1. JS对象 返回/设置时间方法 get/setTime() 返回/设置时间,单位毫秒数 一小时为:60*60*1000

    返回/设置时间方法 get/setTime() 返回/设置时间,单位毫秒数,计算从 1970 年 1 月 1 日零时到日期对象所指的日期的毫秒数. 如果将目前日期对象的时间推迟1小时,代码如下: &l ...

  2. MySQL 查询大于“时间字段”15分钟、1小时、1天的数据

    以下代码中times为时间字段,类型为datetime 1.查询大于times十五分钟的数据 //大于号后面都是获取times十五分钟后的时间select*from table where now() ...

  3. 【视频合集】极客时间 react实战进阶45讲 【更新中】

    https://up2.v.sharedaka.com/video/ochvq0AVfpa71A24bmugS5EewhFM1553702519936.mp4 01 React出现的历史背景及特性介绍 ...

  4. react实战 系列 —— React 的数据流和生命周期

    其他章节请看: react实战 系列 数据流和生命周期 如何处理 React 中的数据,组件之间如何通信,数据在 React 中如何流动? 常用的 React 生命周期方法以及开源项目 spug 中使 ...

  5. react实战系列 —— React 中的表单和路由的原理

    其他章节请看: react实战 系列 React 中的表单和路由的原理 React 中的表单是否简单好用,受控组件和非受控是指什么? React 中的路由原理是什么,如何更好的理解 React 应用的 ...

  6. 往MySQL数据库datetime类型字段中插入数据库的当前时间

    代码: StringBuilder sb = new StringBuilder(); sb.append(" insert into uosdetailfile ("); sb. ...

  7. React实战之Ant Design—Upload上传_附件上传

    React实战之Ant Design—Upload上传_附件上传 Upload组件大家都在官方文档中看过了,但写的时候还是会遇到许多问题,一些新手看了文档后感觉无从下手,本文过多的简绍就不说了,直接看 ...

  8. 如何诊断rac环境sysdate 返回的时间错误

    最近处理了若干rac环境访问sysdate错误的时间返回.而这个问题通常是一个数据库链接是由现在Listener创建的情况下.并且.大部分情况下都是和时区设置相关的.在这篇文章中我们会针对怎样诊断这样 ...

  9. 从零开始react实战:云书签-1 react环境搭建

    总览篇:react 实战之云书签 本篇是实战系列的第一篇,主要是搭建 react 开发环境,在create-react-app的基础上加上如下功能: antd 组件库按需引入 ,支持主题定制 支持 l ...

随机推荐

  1. 【Java源码】集合类-LinkedList

    一.类继承关系 LinkedList和ArrayList都实现了List接口.所以有List的特性,同时LinkedList也实现了Deque,所以它也具有双端队列和栈的特性. public clas ...

  2. hdu6080(最小环)

    题目 http://acm.hdu.edu.cn/showproblem.php?pid=6080 分析 很妙的思路,将里面的点集当作A,将外面的点集当作B 然后O(n^2)枚举两两B点,设一个是u, ...

  3. 学习日常笔记<day16>mysql加强

    1.数据约束 1.1什么是数据约束 对用户操作表的数据进行约束 1.2 默认值 作用:当永辉对使用默认值的字段不插入值的时候,就使用默认值 注意: 1)对默认值字段插入null是可以的 2)对默认值字 ...

  4. Python开发的一个IDE推荐,Sublime Text 3

    Sublime Text 3 官网下载地址为, LINK. 目前最新版本是3114. 这里转载泱泱长空的授权文件(注册码)文章[1],将几个可以用的注册码列举如下: 补充:2016.05 最近经过测试 ...

  5. delphi 的结构体对齐关键字

    Align fields (Delphi)   Go Up to Delphi Compiler Directives (List) Index Type Switch Syntax {$A+}, { ...

  6. 推荐-zabbix原理篇

    推荐-zabbix原理篇(1) 提交 我的留言 加载中 已留言 本文大纲 snmp介绍 监控流程 开源监控工具zabbix zabbix监控功能的实现 支持数据库存储类型 Zabbix架构中的组件 Z ...

  7. Office EXCEL 如何保留两位小数,四舍五入

    选中若干单元格,然后右击设置单元格格式,数值中保留两位小数   使用round函数四舍五入,如下图所示,我在N10单元格中输入"ROUND(M10,1)"即可,其中ROUND是函数 ...

  8. HDU 5303 Delicious Apples (贪心 枚举 好题)

    Delicious Apples Time Limit: 5000/3000 MS (Java/Others)    Memory Limit: 524288/524288 K (Java/Other ...

  9. 挖掘更合适的MVP模式的架构设计

        关于MVP,关于android,不得不说这篇博客已经来的非常晚了,这篇博客早就想写了,一直都在偷懒,就不给自己这么久的偷懒找借口了.尽管这篇文章po出来的比較晚.可是我所接触的程序猿一些朋友之 ...

  10. 【bzoj2152】【聪聪可可】【点分治】

    [问题描写叙述] 聪聪和可但是兄弟俩.他们俩常常为了一些琐事打起来,比如家中仅仅剩下最后一根冰棍而两人都想吃.两个人都想玩儿电脑(但是他们家仅仅有一台电脑)--遇到这样的问题,普通情况下石头剪刀布就好 ...