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 ...
随机推荐
- iOS 进阶 第十九天(0423)
0427 深复制/浅复制 浅复制:是址引用 深复制:是值拷贝 下面是解释,如下图: 运行时机制runtime 1.表象的就是MPMoviePlayer 2.深层的是 clang -rewrite-ob ...
- 谈谈C#中的 Dispose 和 Finalize
主要有一下几点需要知道: 1. Dispose需要实现IDisposable接口. Finalize就是c#中的析构方法,方法名以~开始. 2. Dispose由开发人员代码调用,而Finalize由 ...
- JSP的7个动作指令
动作指令与编译指令不同,编译指令是通知Servlet引擎的处理信息,而动作指令知识运行时的动作.编译指令在将JSP编译成Servlet时起作用,而处理指令通常可替换成JSP脚本,它知识JSP脚本的标准 ...
- OpenGl学习笔记3之模型变换、视图变换、投影变换、视口变换介绍
模型变换.视图变换.投影变换.视口变换介绍 opengl中存在四种变换,分别是模型变换,视图变换,投影变换,视口变换.这四种变换是图形渲染的基本操作,实质上这四种变换都是由矩阵乘法表示(这些操作都是由 ...
- 11.9Daily Scrum
人员 任务分配完成情况 明天任务分配 王皓南 实现网页上视频浏览的功能.研究相关的代码和功能.823 数据库测试 申开亮 实现网页上视频浏览的功能.研究相关的代码和功能.824 实现视频浏览的功能 王 ...
- elasticsearch-查询的基本语法
elasticsearch的查询有两部分组成:query and filter. 两者的主要区别在于:filter是不计算相关性的,同时可以cache.因此,filter速度要快于query. 先记录 ...
- Shell常用操作
1.读取配置文件中的jdbc_url参数的值($InputParamFile为待读取的目标文件绝对路径) jdbc_url=`grep "jdbc_url" $InputParam ...
- JavaScript的DOM操作（1）
1.DOM的基本概念 DOM是文档对象模型,这种模型为树模型:文档是指标签文档:对象是指文档中每个元素:模型是指抽象化的东西. 2.Window对象操作 一.属性和方法: 属性(值或者子对象): op ...
- Linux嵌入式系统与硬件平台的关系
一. Linux嵌入式系统 操作系统是一种在计算机上运行的软件,它的主要任务是管理计算机上的系统资源,为用户提供使用计算机及其外部设备的接口.它存在的目的是为了管理所有硬件资源,并且提供应用软件一个合 ...
- Matlab设置网格线密度（坐标精度）
1.不精确 set(gca,'XMinorTick','on') 这样的话知识x轴显示了细的密度,网格线并没有变. 2.精确 set(gca,'xtick',-1:0.1:1); set(gca,'y ...