react的学习之路

jsx文件值的注意事项

jsx的语法是为了,html模板直接嵌入到js代码里面,需要办原本的模板和组件关联,原本的js不支持这种包含html的语法,所以需要通过工具将jsx编译输出成js代码才能使用, 切记reactshida

1. 使用jsx: 字母开头大写的是组件,小写是标签；
2. 在原本htnl中class,在jsx中成为 classname, for 改成htmlfor；
3. 使用javascipt绑定的数据: {}；
4. 超出html规范中的属性没事data-的前缀；
5. 属性的扩散性 使用查看下面模板
   . ；
6. jsx和html的差异 css要写成js对象的形式；

组件

jsx的语法是为了,html模板直接嵌入到js代码里面,需要办原本的模板和组件关联,原本的js不支持这种包含html的语法,所以需要通过工具将jsx编译输出成js代码才能使用, 切记reactshida

1. 组件的生命周期:
   1.1 componentWillMount: 装在只会加载一次,在render 之前 ；
   1.2 componenDidMount 装在只会加载一次,在render 之后前,可以在活动doom ；
   1.3 更新组件触发
   componentWillReceiveProps
   shouldComponentUpdate
   componentWillUpdate
   componentDidUpdate
   1.4 卸载组件 componentWillUnmount
2. 事件的处理 this.handleClick.bind(this) (bind(this)可以将函数的上下文绑定要要组件示例上)；
3. doom 操作. 可以运用react-dom componentDidMound的周期里面拿到el ,第二种方式就是同过ref的进行,但 是此方法一般只在原生doom才可以；
4. 组合组件,
5. 属性的扩散性 使用查看下面模板