<!DOCTYPE html>
<html>
<head lang="en">
  <meta charset="UTF-8">
  <title></title>
  <script src="js/react.js"></script>
  <script src="js/react-dom.js"></script>
  <script src="js/browser.min.js"></script>
</head>
<body>
<div id="example"></div>

<script type="text/babel">

  var MySwitch = React.createClass({
    getInitialState:function(){
      return {switch:false}
    },
    handleClick:function(){
      this.setState({switch:!this.state.switch});
    },
    render:function(){
      return <button onClick={this.handleClick}>
        {"当前状态为："+this.state.switch}
      </button>
    }
  })
  ReactDOM.render(
  <MySwitch/>,
  document.getElementById('example')
  )

</script>

</body>
</html>

React state状态的更多相关文章

  1. react篇章-React State(状态)-将生命周期方法添加到类中

    将生命周期方法添加到类中 在具有许多组件的应用程序中,在销毁时释放组件所占用的资源非常重要. 每当 Clock 组件第一次加载到 DOM 中的时候,我们都想生成定时器,这在 React 中被称为挂载. ...

  2. react篇章-React State(状态)-组件都是真正隔离的

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> <title&g ...

  3. react篇章-React State(状态)-数据自顶向下流动

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> <title&g ...

  4. React State(状态)

    function FormattedDate(props){ return ( <h1>现在是{props.date}</h1> ) } class Clock extends ...

  5. react篇章-React State(状态)

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> <title&g ...

  6. 原生 JavaScript 实现 state 状态管理系统

    原生 JavaScript 实现 state 状态管理系统 Build a state management system with vanilla JavaScript | CSS-Tricks 在 ...

  7. react state为数组时插入值

    react state为数组时,如何插入值.在react里,一切皆是状态state,如果想通过改变state修改渲染效果,只能yongsetState.但是setState又是key:value格式, ...

  8. React + MobX 状态管理入门及实例

    前言 现在最热门的前端框架,毫无疑问是React. React是一个状态机,由开始的初始状态,通过与用户的互动,导致状态变化,从而重新渲染UI. 对于小型应用,引入状态管理库是"奢侈的&qu ...

  9. React的状态管理工具

    Mobx-React : 当前最适合React的状态管理工具   MobX 简单.可扩展的状态管理        MobX 是由 Mendix.Coinbase.Facebook 开源和众多个人赞助商 ...

随机推荐

  1. ssh linux免密登录。。。。生产共钥到另一台主机

    一.第一种方式: 1.ssh-keygen -t rsa -t : 加密方式 默认为rsa 可以省略不写 加密方式选 rsa|dsa 2.将 .pub 文件复制到目标机器的 .ssh 目录, 并 ca ...

  2. 为什么学习Lua

    目前公认的最快的脚本语言 可以编译调试 与C/C++结合容易 Lua是对性能有要求的必备脚本 C++的缺点: 编译慢,调试难 学习难度大

  3. mysql试题

    drop,delete与truncate的区别:优先级: drop > truncate > deleteTRUNCATE 按行删除并不把删除操作记录记入日志保存(不可恢复)DELETE ...

  4. AI 梯度下降

    梯度下降(gradient descent),是一种用于最优化(通常是最小化),代价函数/损失函数/目标函数/误差函数/准则,的方法. 不过,最值有时很难找到,尤其是在高维情况下,所以常常把局部最优解 ...

  5. 【Codeforces 1132E】Knapsack

    Codeforces 1132 E 题意:给\(cnt_i\)个\(i\)(\(1\leq i\leq 8\)),问用这些数所能构成的最大的不超过\(W\)的数. 思路:随机+贪心... 我们考虑将贪 ...

  6. Android TimeAnimator && TimeListener翻译

    TimeAnimator:提供了一个简单的回调机制,通过 TimeAnimator.TimeListener,在动画的每一帧处通知你.这个动画器没有时间,插值或是对象值设定.回调监听器为每一帧动画接受 ...

  7. 2-STM32物联网开发WIFI(ESP8266)+GPRS(Air202)系统方案升级篇(视频总揽)

    1-STM32物联网开发WIFI(ESP8266)+GPRS(Air202)系统方案升级篇(方案总揽) https://v.youku.com/v_show/id_XNDE0Njk3Njg2OA==. ...

  8. 1-STM32物联网开发WIFI(ESP8266)+GPRS(Air202)系统方案升级篇(方案总揽)

    我的这个升级篇的代码适用于自己所有的带WIFI和GPRS模块的开发板,升级功能实质上是通过MQTT把数据发给WIFI和GPRS模块,然后模块进行保存和运行. 这个升级程序是当时自己花了两个星期的时间写 ...

  9. C#中当程序的访问权限不足时，Directory.Exists和File.Exists方法不会抛出异常报错

    有些时候,我们开发的C#应用程序的执行账号,可能没有对一些文件夹和文件的访问权限,当我们使用Directory.Exists和File.Exists方法去判断这些文件夹和文件是否存在的时候,Direc ...

  10. Springboot 2.0.4 整合Mybatis出现异常Property 'sqlSessionFactory' or 'sqlSessionTemplate' are required

    在使用Springboot 2.0.4 整合Mybatis的时候出现异常Property 'sqlSessionFactory' or 'sqlSessionTemplate' are require ...