//第一个参数是构造的组件，第二个参数是使用组件的容器 reactdom.render( , document.getelementbyid(''));
render渲染页面 将组件放到选定的元素里面
如何定义组件 使用 react.createclass({render:function(){return ( 我是dom元素 )}})构建
var profilepic = react.createclass({ render: function() { //可以在return前进行相关处理 return ( ); } });
1. return()括号中只能填写一个标签，否则报错
2. this.props是 reactdom.render中传递的属性，是一个对象 对于组件套组件的方式可以传递属性值，如下面例子
组件套组件 // 渲染到容器 reactdom.render( , document.getelementbyid('example') ); var avatar = react.createclass({ render: function() { return ( //this.props包含了name和link的属性，同时在profilepic组件中可以使用this.props获取link的值
); } });
如何设置某个变量的初始值 使用 getinitialstate:function(){return {}}声明初始化变量，使用 this.setstate({键值对})修改 getinitialstate函数中的变量，通过 this.state对象获取属性的值，代码如下：
var clickapp = react.createclass({ getinitialstate:function(){ return { clickcount: 0, } }, handleclick: function(e){ this.setstate({ clickcount: this.state.clickcount + 1, }); }, render: function(){ return ( 点击下面按钮 点击我 你一共点击了：{this.state.clickcount}
) } });
getinitialstate在组件的生命周期内只会运行一次，用来设置组件的初始状态。
this.props.children this.props对象的属性与组件的属性一一对应，但是有一个例外，就是 this.props.children属性，它表示组件的所有子节点。
this.props.children的值有三种可能：如果当前组件没有子节点，它就是 undefined;如果有一个子节点，数据类型是 object；如果有多个子节点，数据类型就是 array。react 提供一个工具方法 react.children来处理 this.props.children。我们可以用 react.children.map来遍历子节点，而不用担心 this.props.children的数据类型是 undefined还是 object
proptypes 验证组件提供的参数是否满足要求。如 proptypes: { title: react.proptypes.string.isrequired },render:function(){return}代码的作用就是说明 title是必须填写的而且为字符串。 使用 getdefaultprops来配置默认的字符串 getdefaultprops : function () { return { title : 'hello world'};},
组件的生命周期 生命周期分为三个状态：
mounting：已插入真实 dom
updating：正在被重新渲染
unmounting：已移出真实 dom
react 为每个状态都提供了两种处理函数，will 函数在进入状态之前调用，did 函数在进入状态之后调用，三种状态共计五种处理函数。
componentwillmount()
componentdidmount()
componentwillupdate(object nextprops, object nextstate)
componentdidupdate(object prevprops, object prevstate)
componentwillunmount()
此外，react 还提供两种特殊状态的处理函数。
componentwillreceiveprops(object nextprops)：已加载组件收到新的参数时调用
shouldcomponentupdate(object nextprops, object nextstate)：组件判断是否重新渲染时调用
jsx转化器 1.内嵌的 jsx代码，需要在script标签中要加上 type=text/babel，并引入 browser.min.js 5.8.24文件，或者使用 bower install babel --save-dev下载babel文件中获取，将 es6转化为 es5 2. [已废弃]使用 react-tools模块，将代码转化成线上代码 使用 npm install -g react-tools安装，使用 jsx --watch src/ build/转化
3.可以直接使用 babel转化， babel --presets react [es2015] src --watch --out-dir build，其中 [es2015]是选填项， src是源文件路径 build是编译后的文件路径
4.在 gulp中使用 gulp-react转化
html转义 对于某些富文本内容，在页面上显示
var content='content'; react.render( {content}
, document.body ); //会直接显示 content 相当于ejs中
html默认会对html文章转义，如何不转义
var content='content'; react.render(
, document.body );
cdn文件 1. react
react包括 react.createelement、 react.createclass、 react.component、 react.proptypes、 react.children
react-dom包括 reactdom.render、 .unmountcomponentatnode、 .finddomnode react-dom-server包括 .rendertostring和 .rendertostaticmarkup react-with-addons
html 标签 vs. react 组件 react.render方法可以渲染html结构，也可以渲染react组件。 jsx使用首字母大小写来区分是本地组件类还是html标签。
(1)渲染html标签，声明变量采用 首字母小写
var mydivelement = ; react.render(mydivelement, document.body);
(2)渲染react组件，声明变量采用首字母大写
var mycomponent = react.createclass({/*...*/}); var myelement = ; react.render(myelement, document.body);
small tips 1.数据的传递都是需要至于 {}之中，包括赋值 , {}中的变量都是可以通过 reactdom.render时传入
2.使用 default为前缀，加上 checked, value等设置默认值，如 defaultchecked, defaultvalue等，在组件中使用已有的属性。
3. this.refs引用对象集合，在dom元素上添加了 ref属性后，就会将这个dom元素添加到 this.refs之中，在页面中这个标签的值是唯一的， this.refs.xxxx.value这种方式可以获取变量的值， ref是一种回调的原理，当子组件的该属性值改变，相应的值会回调给父组件
4.在组件实现时， return({ }
)中的 {}可以加入大量的javascript处理函数，如下：
return ( { this.props.list.map(function (child) { return {child} //注意这种写法，{child} }) } );
5.组件可以直接当做dom标签一样使用，像 button, h1等
6.与javascript dom中一样的写法， class对于 classname, html对应于 htmlfor；另外，对于非html内置的属性，一定要加上 data-，如
`
7.jsx 的基本语法规则
遇到 html 标签（以
遇到代码块（以 { 开头），就用 javascript 规则解析
8.this.props 和 this.state不同点
由于 this.props和 this.state都用于描述组件的特性，可能会产生混淆。一个简单的区分方法是, this.props表示那些一旦定义，就不再改变的特性，而 this.state是会随着用户互动而产生变化的特性。
9.组件中样式的写法： style=max-width:90%这种方式错误；使用 style={{opacity: this.state.opacity}}这种方式，第一重大括号表示这是 javascript 语法，第二重大括号表示样式对象。
10.在 componentdidmount中的设置请求返回的数据需要特别注意只有当数据返回回来才有效，通过 this.ismounted()判读，或者直接使用 promise的 then方法.查看 示例12
参考文档 1.阮一峰老师的 [react-demos](https://github.com/ruanyf/react-demos)