react学习

认识

传统模式->服务器/用户输入的交互数据->动态反应到复杂页面
存在的问题：代码量越来越大，难以维护，力不从心。
Angular.js(MVVM)：不适合用于性能要求比较高的框架，不利于重用，比较复杂。
react的优势：
1、react不是一个完整的MVC，MVVM框架
2、react跟Web Component不冲突
3、react的特点就是'轻'
4、组件化的开发思路(重点)
tip：语法糖(糖衣语法),是指计算机语言中添加某种语法，对语言的功能并没有影响，只是增加程序可读性，减少出错机会。
tip：JSX，javascript XML
5、JSX的特点
类似XML语法，容易接受
增强js语义
结构清晰
抽象程度高
代码模块化
6、JSX解释架构
入口函数-->多个模块-->解析JSX-->执行js
注意事项：
render方法中返回的HTML代码只能有一个根节点
render方法返回的HTML代码中标签的class属性应该写为className，for属性也应该写为htmlFor
使用React.createClass创建的组件名第一个字母必须大写

应用场景

1、复杂场景下的高性能
2、重用组件库，组件组合

生命周期

1、mounting
getDefaultProps()
getInitialState()
componentWillMount
render
conponentDidMount
2、undating
componentWillReceiveProps(setPros)
shouldComponentUpdate(setState)
componentWillUpdate
render
componentDidUpdate
3、Unmounting
componentWillUnmount
tip：组件的state是可变的，props是不变的(一次复制)
tip：reate采用驼峰式书写变量、函数、事件

事件

如何绑定事件?在标签内使用驼峰式命名onCLick
如何获取子组件?在子组件中声明ref，方法中通过React.findDomNode(this.refs)