<!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. CentOS7编译安装MySQL5.7.24

    目录 安装依赖 安装boost 编译安装MySQL 配置 登录MySQL,修改密码 安装依赖 (1)cmake是新版MySQL的编译工具 sudo yum install gcc gcc-c++ pc ...

  2. Ubuntu16.04.1 安装Nginx

    Nginx ("engine x") 是一个高性能的 HTTP 和 反向代理 服务器,也是一个 IMAP/POP3/SMTP 代理服务器. Nginx 是由 Igor Sysoev ...

  3. C++ Opencv createTrackbar()创建滑动条实现对比度、亮度调节及注意事项

    一.对比度.亮度概念普及 1.1对比度 对比度指的是一幅图像中明暗区域最亮的白和最暗的黑之间不同亮度层级的测量,差异范围越大代表对比越大,差异范围越小代表对比越小.对比度对视觉效果的影响非常关键,一般 ...

  4. 使用githubpages主题NexT的语法

    使用githubpages主题NexT的语法 NexT 前言 不知道为啥?网站总是不出现? 添加「标签」页面 title: 标签测试文章 tags: - Testing - Another Tag - ...

  5. [Postman]证书(13)

    Postman的本机应用程序提供了一种基于每个域查看和设置SSL证书的方法. 要管理客户端证书,请单击标题工具栏右侧的扳手图标,选择“设置”,然后选择“ 证书”选项卡. 添加客户端证书 要添加新客户端 ...

  6. js对象之XMLHttpReques对象学习

    背景:业务需求是,一个前端(手机和浏览器)HTML页面中有图片,按钮......,需要统计用户点击图片或者按钮的次数. 前端实现:通过一个js来统计HTML页面中所有的图片和按钮对象,并给每个对象赋予 ...

  7. Python编程Day7——字符编码、字符与字节、文件操作

    一.字符编码 重点 ***** 1. 什么是字符编码:将人识别的字符转换计算机能识别的01,转换的规则就是字符编码表2. 常用的编码表:ascii.unicode.GBK.Shift_JIS.Euc- ...

  8. 关于 Abp 替换了 DryIoc 框架之后的问题

    在之前有些过一篇文章 <使用 DryIoc 替换 Abp 的 DI 框架> ,在该文章里面我尝试通过以替换 IocManager 内部的 IContainer 来实现使用我们自己的 DI ...

  9. Java核心技术及面试指南 集合部分总的面试题归纳以及答案

    3.6.1ArrayList和LinkedList有什么差别?在哪种场景里应当用ArrayList(或LinkedList)? 大家如果学过数据结构,这个问题不难回答:前者是基于数组,数组比较擅长索引 ...

  10. ionic2 基于ngx-translate实现多语言切换，翻译

    介绍 ngx-translate 是Angular 2+的国际化(i18n)库,在github的地址是箭头 https://github.com/ngx-translate/core 将ngx-tra ...