<!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. Java面试题总结（附答案）

    1.什么是B/S架构?C/S架构? B/S(Browser/Server),浏览器/服务器程序: C/S(Client/Server),客户端/服务端,桌面应用程序. 2.网络协议有哪些? HTTP: ...

  2. [Postman]Postman导航(3)

    Postman提供了一个多窗口和多标签界面,供您使用API​​. 此界面设计为您提供尽可能多的API空间. 侧边栏 邮差侧边栏可让您查找和管理请求和集合.侧边栏有两个主要选项卡:  历史记录  和   ...

  3. Oracle的nvl函数和nvl2函数

    一.基本语法 介绍一下oracle的nvl函数和nvl2函数. nvl函数 nvl函数基本语法为nvl(E1,E2),意思是E1为null就返回E2,不为null就返回E1. nvl2函数 nvl2函 ...

  4. API接口开发（持续更新）

    1. 接口调用失败时的处理方式 接口调用失败时分为 请求失败和业务失败. 请求失败的相关信息可通过HTTP状态码体现出来, 业务失败的相关信息需要在返回数据中体现出来. 2. 分页查询 批量查询时需要 ...

  5. 解决关于:TypeError: Class constructor Model cannot be invoked without 'new'

    问题描述:在工作过程中出现 TypeError: Class constructor Model cannot be invoked without 'new' 这个错误 以下是报错代码: class ...

  6. sql server 索引阐述系列四 表的B-Tree组织

    一.概述 说到B-tree组织,就是指索引,它可以提供了对数据的快速访问.索引使数据以一种特定的方式组织起来,使查询操作具有最佳性能.当数据表量变得越来越大,索引就变得十分明显,可以利用索引查找快速满 ...

  7. HashTable原理与源码分析

    本文版权归 远方的风lyh和博客园共有,欢迎转载,但须保留此段声明,并给出原文链接,谢谢合作,如有错误之处忘不吝批评指正! HashTable内部存储结构 HashTable内部存储结构为数组+单向链 ...

  8. spring学习(四) ———— 整合web项目(SSH)

    清楚了spring的IOC 和 AOP,最后一篇就来整合SSH框架把,记录下来,以后应该会用的到. --WH 一.web项目中如何使用spring? 当tomcat启动时,就应该加载spring的配置 ...

  9. 翻译：load data infile(已提交到MariaDB官方手册)

    本文为mariadb官方手册:LOAD DATA INFILE的译文. 原文:https://mariadb.com/kb/en/load-data-infile/ 我提交到MariaDB官方手册的译 ...

  10. 解读经典《C#高级编程》第七版 Page79-93.对象和类型.Chapter3

    前言 本篇我们继续讲解本章其余的部分:构造函数.只读字段.匿名类型.结构详解.部分类.静态类.Object类.扩展方法,等. 01 类 构造函数 构造函数是一种特殊的方法: 与类同名 没有返回值,甚至 ...