react5 事件 satate
<body>
<!-- React 真实 DOM 将会插入到这里 -->
<div id="example"></div>
<!-- 引入 React -->
<script src="src/libs/react.js"></script>
<!-- 引入 JSX 语法格式转换器 -->
<script src="src/libs/JSXTransformer.js"></script>
<script src="src/libs/jquery.js"></script>
<!-- 注意：script 需要注明 type 为 text/jsx 以指定这是一个 JSX 语法格式 -->
<script type="text/jsx">
var Count = React.createClass({
incrementCount:function () {
this.setState({
count: this.state.count + 1
});
},
getInitialState:function(){
return {
count:0
}
},
render:function(){
return (
<div className='component'>
<h1>Count: {this.state.count}</h1>
<button type="button" onClick={this.incrementCount}>点击me</button>
</div>
);
}
})
React.render(
<Count />,
document.getElementById('example')
);
</script>
</body>
注意我上面标记的地方是不能添加分号的
JSX中的事件绑定
JSX支持事件的绑定，语法类似于HTML中事件的绑定，不同的是这里事件的名称必须按照驼峰式，例如change变成onChange,click变成onClick等。
this.state
组件免不子要与用户互动，React的一大创新，就是将组件看成是一个状态机，一开始有一个初始状态，然后用户互动，导致状态变化，从而触发重新渲染UI
在这模块中，有一个新的函数 getInitialState 。当模块初始化的时候，React会调用这个函数。而返回的对象则作为React的初始化状态(看函数名就知道)。
react5 事件 satate的更多相关文章
- JNI详解---从不懂到理解
转载:https://blog.csdn.net/hui12581/article/details/44832651 Chap1:JNI完全手册... 3 Chap2:JNI-百度百科... 11 C ...
- Jquery的点击事件，三句代码完成全选事件
先来看一下Js和Jquery的点击事件 举两个简单的例子 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN&q ...
- 关于 Chrome 浏览器中 onresize 事件的 Bug
我在写插件时用到了 onresize 事件,在反复地测试后发现该事件在 Chrome 及 Opera(内核基本与 Chrome 相同,以下统称 Chrome)浏览器打开时就会执行,这种情况也许不能算作 ...
- MVVM设计模式和WPF中的实现（四）事件绑定
MVVM设计模式和在WPF中的实现(四) 事件绑定 系列目录: MVVM模式解析和在WPF中的实现(一)MVVM模式简介 MVVM模式解析和在WPF中的实现(二)数据绑定 MVVM模式解析和在WPF中 ...
- C++中的事件分发
本文意在展现一个C++实现的通用事件分发系统,能够灵活的处理各种事件.对于事件处理函数的注册,希望既能注册到普通函数,注册到事件处理类,也能注册到任意类的成员函数.这样在游戏客户端的逻辑处理中,可以非 ...
- 移动端IOS点击事件失效解决方案
解决方案 解决办法有 4 种可供选择: 1 将 click 事件直接绑定到目标元素(即 .target)上 2 将目标元素换成 <a> 或者 button 等可点击的元素 3 将 clic ...
- Android笔记——Button点击事件几种写法
Button点击事件:大概可以分为以下几种: 匿名内部类 定义内部类,实现OnClickListener接口 定义的构造方法 用Activity实现OnClickListener接口 指定Button ...
- HTML 事件(一) 事件的介绍
本篇主要介绍HTML中的事件知识:事件相关术语.DOM事件规范.事件对象. 其他事件文章 1. HTML 事件(一) 事件的介绍 2. HTML 事件(二) 事件的注册与注销 3. HTML 事件(三 ...
- HTML 事件(二) 事件的注册与注销
本篇主要介绍HTML元素事件的注册.注销的方式. 其他事件文章 1. HTML 事件(一) 事件的介绍 2. HTML 事件(二) 事件的注册与注销 3. HTML 事件(三) 事件流.事件委托 4. ...
随机推荐
- 今天我们要说的画一个三角形，恩，画一个三角形，第一种呢是利用我们的html标签结合css来实现；而第二种方法就就是我们的html5新增的一个标签canves,这个canves就是网页画幕，那么顾名思义就是在网页里建造一个画板，用来画画，好，那接下来就和我一起去看看吧！
第一种方法:利用我们的html标签结合css来实现 span{ width:0px; height:0px; border-width:7px; border-style:solid; border- ...
- 通过硬编码获取dubbo服务对象
运维进行监控dubbo服务的时候可能会调用dubbo服务对象,并且定期去执行,这时候如果需要添加新的服务,可能需要修改监控dubbo服务的配置,即dubbo-producer.xml或是dubbo-c ...
- HTML的ul和li标签的使用
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...
- Add more security in Visual Studio 2012
Compile flags: /GS: Stack protection from buffer overrun. /SDL: Subset of W3&W4 security warning ...
- RHEL6.5 删除桌面启动器（计算机/Home/回收站）
首先,安装gconf-editor以获得gconftool-2命令 终端命令: gconftool-2 --set /apps/nautilus/desktop/computer_icon_visib ...
- 你好，欢迎来到我的博客，我是博主royalmice1
你好,欢迎来到我的博客,我是博主royalmice
- poj 3067 - Japan(树状数组)
先按第一个数从大到小排序,相等的情况下,第二个数按照从大到小排序..... 预处理后,照着树状数组写就行了... 注意:k的最大值应取1000*1000 代码如下: include <cstdi ...
- 在浏览器的JavaScript里new Date().toUTCString()后，传递给C# DateTime().TryParse()会发生什么？
Format 1. Sun, 09 Oct 2016 13:24:35 GMT Format 2. Sun, 9 Oct 2016 13:36:09 UTC Format 1 是在IE里面产生的(Wi ...
- halcon读取一张照片，并转化为灰度图像
dev_close_window () read_image (Image, 'E:/图片/123.jpg') get_image_size (Image, Width, Height) dev_op ...
- iBeacon行为分析
研究iBeacon也有段时间了, 总结一下这段时间对于ibeaacon行为的分析. iOS 7.0及以后的版本开始支持iBeacon. 硬件方面, iPhone4S 及以后, ipad 3代及以后, ...