<!DOCTYPE html>
<html>
<head>
<script src="../../build/react.js"></script>
<script src="../../build/react-dom.js"></script>
<script src="../../build/browser.min.js"></script>
</head>
<body>
<div id="example"></div>
<script type="text/babel">
var Timer = React.createClass({
getInitialState : function(){
return {secondsElapsed:0};
}, tick : function(){
this.setState({secondsElapsed:this.state.secondsElapsed + 1});
}, componentDidMount : function(){
this.interval = setInterval(this.tick,1000);
}, componentWillUnmount : function(){
clearInterval(this.interval);
}, render : function(){
return (
<div>secondsElapsed:{this.state.secondsElapsed}</div>
)
},
}); ReactDOM.render(
<Timer />,
document.getElementById('example')
);
</script>
</body>
</html>

  

react-conponent-secondesElapsed的更多相关文章

  1. props & children

    一. choosing the type at runtime import React from 'react'; import { PhotoStory, VideoStory } from '. ...

  2. 正式学习React(五) react-redux源码分析

    磨刀不误砍柴工,咱先把react-redux里的工具函数分析一下: 源码点这里  shallowEqual.js export default function shallowEqual(objA, ...

  3. [React] 13 - Redux: react-redux

    Ref: Redux 入门教程(三):React-Redux 的用法 组件拆分规范 使用 React-Redux,需要掌握额外的 API,并且要遵守它的组件拆分规范. React-Redux 将所有组 ...

  4. react组件的生命周期

    写在前面: 阅读了多遍文章之后,自己总结了一个.一遍加强记忆,和日后回顾. 一.实例化(初始化) var Button = React.createClass({ getInitialState: f ...

  5. 十分钟介绍mobx与react

    原文地址:https://mobxjs.github.io/mobx/getting-started.html 写在前面:本人英语水平有限,主要是写给自己看的,若有哪位同学看到了有问题的地方,请为我指 ...

  6. RxJS + Redux + React = Amazing!(译一)

    今天,我将Youtube上的<RxJS + Redux + React = Amazing!>翻译(+机译)了下来,以供国内的同学学习,英文听力好的同学可以直接看原版视频: https:/ ...

  7. React 入门教程

    React 起源于Facebook内部项目,是一个用来构建用户界面的 javascript 库,相当于MVC架构中的V层框架,与市面上其他框架不同的是,React 把每一个组件当成了一个状态机,组件内 ...

  8. 通往全栈工程师的捷径 —— react

    腾讯Bugly特约作者: 左明 首先,我们来看看 React 在世界范围的热度趋势,下图是关键词“房价”和 “React” 在 Google Trends 上的搜索量对比,蓝色的是 React,红色的 ...

  9. 2017-1-5 天气雨 React 学习笔记

    官方example 中basic-click-counter <script type="text/babel"> var Counter = React.create ...

  10. RxJS + Redux + React = Amazing!(译二)

    今天,我将Youtube上的<RxJS + Redux + React = Amazing!>的后半部分翻译(+机译)了下来,以供国内的同学学习,英文听力好的同学可以直接看原版视频: ht ...

随机推荐

  1. ScrollView嵌套子View的getDrawingCache为空的解决方法

    ScrollView嵌套子View的getDrawingCache为空的解决方法 问题 将组件的显示布局改为可以滚动的,然后用ScrollView作为了View的父类,发现View的getDrawin ...

  2. 第55节:Java当中的IO流-时间api(下)-上

    Java当中的IO流(下)-上 日期和时间 日期类:java.util.Date 系统时间: long time = System.currentTimeMillis(); public class ...

  3. 使用线程统计信息(Thread Statistics)

    可在session log中使用线程统计信息来判断source,target或组的性能瓶颈 默认情况下,Integration Service在运行session时,使用一个reader thread ...

  4. aaa配置(第十三组)

    拓扑 网络情况 A PING B A PING C PC-B PING PC-C 2.R1的配置 a.console线 R1(config)#username admin1 password Admi ...

  5. Python——爬虫进阶

    课程内容 Python爬虫——反爬 Python加密与解密 Python模块——HashLib与base64    Python爬虫——selenium模块 Python——pytessercat识别 ...

  6. promise与async-await

    一. async/await 相对 promise 的优势 async/await 拥有更通用的作用域,使得代码有更好的易读性和可维护性. promise 由于其链式调用,每一个函数都有自己的作用域, ...

  7. 使用Redis中间件解决商品秒杀活动中出现的超卖问题(使用Java多线程模拟高并发环境)

    一.引入Jedis依赖 可以新建Spring或Maven工程,在pom文件中引入Jedis依赖: <dependency> <groupId>redis.clients< ...

  8. vue 移动端屏幕适配 使用rem

    要想移动端适配 并使用 rem  您需要先看这篇文章,配置好less ➡️ 在vue 中使用 less,就可以使用rem了 如果项目已经开发的差不多了,没有用到rem 又要使用rem,您用这招. po ...

  9. Linux编程 23 shell编程(结构化条件判断 命令if -then , if-then ... elif-then ...else,if test)

    一.概述 在上一篇里讲到了shell脚本,shell按照命令在脚本中出现的顺序依次进行处理,对于顺序操作已经足够了,但许多程序要求对shell脚本中的命令加入一些逻辑流程控制,这样的命令通常叫做 结构 ...

  10. java遍历Map

    //方法一 Set<String> keys = map.keySet(); for (String key:keys) { System.out.println(key+",& ...