React状态的含义和用法
一、
二、代码
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="UTF-8">
<title>Hello, World</title>
</head>
<body>
<script src="./react-0.13.2/react-0.13.2/build/react.js"></script>
<script src="./react-0.13.2/react-0.13.2/build/JSXTransformer.js"></script>
<script type="text/jsx">
var style = {
color: "red",
border: "1px #000 solid",
};
var HelloWorld = React.createClass({
render: function () {
return <p>Hello, {this.props.name}</p>;
},
});
var HelloUniverse = React.createClass({
getInitialState: function () {
return {
name: 'Tim',
};
},
handleChange: function (event) {
this.setState({name: event.target.value});
},
render: function () {
return <div>
<HelloWorld name={this.state.name}></HelloWorld>
<br/>
<input type="text" onChange={this.handleChange} />
</div>
},
});
React.render(<div style={style}><HelloUniverse></HelloUniverse></div>, document.body);
</script>
</body>
</html>
React状态的含义和用法的更多相关文章
- 转: ES6异步编程: co函数库的含义与用法
转: ES6异步编程: co函数库的含义与用法 co 函数库是著名程序员 TJ Holowaychuk 于2013年6月发布的一个小工具,用于 Generator 函数的自动执行. 比如,有一个 Ge ...
- UML类图中箭头和线条的含义和用法
UML类图中箭头和线条的含义和用法 在学习UML过程中,你经常会遇到UML类图关系,这里就向大家介绍一下UML箭头.线条代表的意义,相信通过本文的介绍你对UML中箭头.线条的意义有更明确的认识. AD ...
- React中Props 和 State用法
React中Props 和 State用法 1.本质 一句话概括,props 是组件对外的接口,state 是组件对内的接口.组件内可以引用其他组件,组件之间的引用形成了一个树状结构(组件树),如果下 ...
- 借鉴redux，实现一个react状态管理方案
react状态管理方案有很多,其中最简单的最常用的是redux. redux实现 redux做状态管理,是利用reducer和action实现的state的更新. 如果想要用redux,需要几个步骤 ...
- http 状态码含义
HTTP状态码被分为五大类, 目前我们使用的HTTP协议版本是1.1, 支持以下的状态码.随着协议的发展,HTTP规范中会定义更多的状态码. 小技巧: 假如你看到一个状态码518, 你并不知道具体51 ...
- 转: ES6异步编程:Thunk函数的含义与用法
转: ES6异步编程:Thunk函数的含义与用法 参数的求值策略 Thunk函数早在上个世纪60年代就诞生了. 那时,编程语言刚刚起步,计算机学家还在研究,编译器怎么写比较好.一个争论的焦点是&quo ...
- 转: ES6异步编程:Generator 函数的含义与用法
转: ES6异步编程:Generator 函数的含义与用法 异步编程对 JavaScript 语言太重要.JavaScript 只有一根线程,如果没有异步编程,根本没法用,非卡死不可. 以前,异步编程 ...
- LODOP获取打印机状态码和状态码含义测试
由于打印机千差万别,打印机执行的标准也不一样,LODOP获取的打印状态码也可能不同,安装了个打印机驱动实际测试一下,测试的打印机驱动是Brother Color Type3 Class Driver. ...
- Delphi maskedit控件的掩码含义及用法方法
Delphi maskedit控件的掩码含义及用法方法 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 2 ...
随机推荐
- Json.Net使用JSON Schema验证JSON格式【实例】
给出一个Json,验证其格式是否符合规则. { "coord": { //对象 "lon": 145.77, "lat": -16.92 } ...
- VC++ MFC 如何实现在编辑框中输出具有换行功能的文段 01
很久不来写东西了,昨天睡觉前写个小工具,突然,这玩意不会换行怎么整... 首先是第一步,获取字符串的长度,转载自白乔的文章. ------------------------------------- ...
- Material
renderer.material 物理材质 实现二维图上的人物动作 新建Material,选择Shader(著色器)为transparent/diffuse(背景透明),将上图拉到背景图选项中. ...
- PHP字符串处理常用方法
strlen("字符串");//取字符串的长度 strcmp($a,$b); //判断两个字符串是否相同,相同返回0,$a>$b返回1,$a<$b返回-1,区分大小写 ...
- 【CodeForces】【338E】Optimize!
线段树 先搞出来每个a[i]能连多少条边记为w[i]……如果对一组s[i],都满足w[i]-rank[i]>=0则这是一组合法方案,然后线段树维护w[i]-rank[i](第一个元素出去的时候后 ...
- iTunes Connect TERMS OF SERVICE
iTunes Connect TERMS OF SERVICE THESE TERMS OF SERVICE CONSTITUTE A LEGAL AGREEMENT BETWEEN YOU AND ...
- 响应式嵌入 iframe Pym.js
Pym.js 可以让你在嵌入 iframe 的时候可自动的对 iframe 的大小进行调整以适应父一层容器,并且可以避免跨域问题. 支持浏览器: Internet Explorer 9, 10 (Wi ...
- 华农js抢课神器
又到了华农选课的时候,服务器估计就受不了,每天奔溃几次,这次选课贪心了点,竟然选了5门,好吧,我承认我只中了1门,什么??刚刚换课给同学马上就被人抢了?我来告诉你原因吧,最近发现一位大神写了一份js脚 ...
- 本地搭建Dubbo监控中心的安装步骤
Dubbo监控中心的安装步骤 参考链接:http://blog.csdn.net/lichunan/article/details/40349645 一.从github上下载dubbo源码进行编译: ...
- 用 VIPER 构建 iOS 应用架构（1）
[编者按]本篇文章由 Jeff Gilbert 和 Conrad Stoll 共同编写,通过构建一个基础示例应用,深入了解 VIPER,并从视图.交互器等多个部件理清 VIPER 的整体布局及思路.通 ...