react的一些笔记

1、用jsx语法写组件，然后再用react工具将jsx编译成js，最后才上线。这样就不用再前端加载体积很大的browser.js(用于在客户端将jsx语法编译成js语法)，极大的提升了加载速度。

　　1.1，使用npm 全局安装 react-tools ：

　　　　npm install -g react-tools

　　1.2，并使用命令行工具转化即可（具体用法可以参考 jsx -h ）：

　　　　jsx src/ build/

生产环境化：预编译JSX

如果你有npm，你可以简单地运行npm install -g react-tools来安装我们的命令行jsx工具。这个工具会把使用JSX语法的文件转换成纯的可以直接在浏览器里面运行起来的JavaScript文件。它也会为你监视目录，然后自动转换变化的文件；例如：jsx --watch src/ build/。运行jsx --help来查看更多关于如何使用这个工具的信息。

 

2、React 的 JSX 使用大写和小写字母来区分本地的组件类和 HTML 标签

 

3、JSX是HTML和JavaScript混写的语法，当遇到 < ，JSX就当HTML解析，遇到 { 就当JavaScript解析。

 

4、延伸属性

　　var props = {}; props.foo = x; props.bar = y; var component = <Component {...props} />; //或者 var props = { foo: x, bar: y }; var component = <Component { ...props } />;

5、使用jsx语法写代码时，要注意加上type="text/babel"属性，不然会出现解析错误

6、如果body元素使用了定位(头部使用了定位)，那么window绑定onscroll事件无效，只能绑定在没有使用定位的元素上；页面中如果没有元素使用定位，那么onscroll只能绑定在window上，绑定在其它元素均无效。

7、this.setState 有引用到的变量的那部分才会更新，react不是重新创造节点，而是在现有的节点上update。