export default class index extends Component {
constructor() {
super();
this.state = { date: new Date() };
}
componentWillMount() {
this.timer = setInterval(() => { this.setState({ date: new Date() }) }, 1000);
}
componentWillUnmount() {
clearInterval(this.timer);
this.timer = null;
}
 
render() {
let t = this.state.date;
let year = t.getFullYear();
let month = t.getMonth() + 1;
let day = t.getDay() + 1;
let hour = ((t.getHours() < 10) ? "0" : "") + t.getHours();
let minutes = ((t.getMinutes() < 10) ? "0" : "") + t.getMinutes();
let ifnoon = ' ' + ((t.getHours() < 12) ? "上午" : "下午") + ' ';
return (
<div className="header">
<Row className="breadcrumb">
<Col span={4} className="breadcrumb-title">首页</Col>
<Col span={20} className="weather">
<span className="date">{year + '/' + month + '/' + day + ifnoon + hour + ':' + minutes}</span>
</Col>
</Row>
</div>
)
}
}

React时间转换为具体的年月日上午下午的更多相关文章

  1. 时间操作(JavaScript版)—页面显示格式:年月日 上午下午 时分秒 星期

    版权声明:本文为博主原创文章,未经博主同意不得转载. https://blog.csdn.net/wangshuxuncom/article/details/35222531 <!DOCTYPE ...

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

    React实战之将数据库返回的时间转换为几分钟前.几小时前.几天前的形式. 不知道大家的时间格式是什么样子的,我先展示下我这里数据库返回的时间格式 ‘2019-05-05T15:52:19Z’ 是这个 ...

  3. java12小时制的时间转换为24小时制

    Java中将12小时制的时间转换为24小时制的方式如下: import java.text.SimpleDateFormat; import java.util.Date; public class ...

  4. 转自文翼的博客:将本地时间转换为 GMT 时间

    在写 RSS 订阅接口的时候,发现最终输出文章的 RSS 时间(GMT时间),在本地上显示的时间和在服务器上显示的时间不一致. 原因是时区不一致,那么在 JavaScript 中,如何将时间转换为统一 ...

  5. Python中如何把一个UTC时间转换为本地时间

    需求: 将20141126010101格式UTC时间转换为本地时间. 在网上搜了好长时间都没有找到完美的解决方案.有的引用了第三方库,这就需要在现网安装第三方的软件.这个是万万不可的.因为真实环境不一 ...

  6. unix时间转换为datetime\datetime转换为unixtime

    /// <summary> /// unix时间转换为datetime /// </summary> /// <param name="timeStamp&qu ...

  7. UTC时间转换为本地时间

    UTC时间转换为本地时间DATEADD(hour, DATEDIFF(hour,GETUTCDATE(),GETDATE()), OrderDate) <'2015-02-02' DECLARE ...

  8. 【測试工具】一个将Unix时间转换为通用时间的工具

    一个将Unix时间转换为通用时间的工具 演示效果: 点击转换之后变为: 源码: function calctime2(){ var time = window.document.getElementB ...

  9. 生成二维码 加密解密类 TABLE转换成实体、TABLE转换成实体集合(可转换成对象和值类型) COOKIE帮助类 数据类型转换 截取字符串 根据IP获取地点 生成随机字符 UNIX时间转换为DATETIME\DATETIME转换为UNIXTIME 是否包含中文 生成秘钥方式之一 计算某一年 某一周 的起始时间和结束时间

    生成二维码 /// <summary>/// 生成二维码/// </summary>public static class QRcodeUtils{private static ...

  10. 将毫秒时间转换为yyyy-MM-dd HH:mm:ss格式

    /** * 将毫秒时间转换为yyyy-MM-dd HH:mm:ss格式 */ public static String getDateFromTimeMillis(Long timeMillis) { ...

随机推荐

  1. 高性能MySQL实战(二):索引 | 京东物流技术团队

    我们在上篇 高性能MySQL实战(一):表结构 中已经建立好了表结构,这篇我们则是针对已有的表结构和搜索条件为表创建索引. 1. 根据搜索条件创建索引 我们还是先将表结构的初始化 SQL 拿过来: C ...

  2. 使用JSON.stringify()去实现深拷贝,要小心哦,可能有巨坑

    对象中有时间类型的时候(时间类型会被变成字符串类型数据) const obj = { date: new Date() } console.log(typeof obj.date === 'objec ...

  3. x509: cannot validate certificate for xxx because it doesn't contain any IP SANs

    项目中有时候需要访问https网站,但如果该网站使用的是自建证书,那client端验证server端证书时,有时候会报错: x509: cannot validate certificate for ...

  4. 8.9 RDTSC时钟检测反调试

    RDTSC时钟检测同样可实现反调试检测,使用时钟检测方法是利用rdtsc汇编指令,它返回至系统重新启动以来的时钟数,并且将其作为一个64位的值存入EDX:EAX寄存器中,通过运行两次rdstc指令,然 ...

  5. 分布式缓存-Redis集群

    一.单点Redis弊端 1.数据丢失问题:Redis是内存存储,服务器重启可能会丢失数据 2.并发能力问题:单节点Redis并发能力虽然不错,但也无法满足如618这样的高并发场景 3.故障恢复问题:如 ...

  6. STM32CubeMX教程30 USB_DEVICE - MSC外设_读卡器

    1.准备材料 正点原子stm32f407探索者开发板V2.4 STM32CubeMX软件(Version 6.10.0) keil µVision5 IDE(MDK-Arm) ST-LINK/V2驱动 ...

  7. ubuntu离线安装tcpdump

    环境 Distributor ID: Ubuntu Description: Ubuntu 16.04.5 LTS Release: 16.04 Codename: xenial 准备安装包 tcpd ...

  8. Leetcode刷题第六天-回溯

    131:分割回文串 链接:131. 分割回文串 - 力扣(LeetCode) for 遍历字符串 递归切割,切割到字符串尾,单次结束 1 class Solution: 2 def partition ...

  9. 零基础入门Vue之梦开始的地方——插值语法

    一.Vue 我!作为初学者,既然要将Vue,那我一定要介绍一下他是什么?我们可以应用一下官方的话 vue的介绍 Vue (读音 /vjuː/,类似于 view) 是一套用于构建用户界面的渐进式框架.与 ...

  10. 关于OJ中的输入格式的问题

    输入:1 2 3 4 5 6 7 8 9 10 如上的输入,并未告诉我们终止条件,这种无上限输入的格式可以用以下格式读入 int main() { int S[100]; int i = 0; whi ...