React 开发记录

学习使用 React 要注意点地方有哪些呢？

1. JSX class 是关键字要用className替代， for也是关键字要用 htmlFor 代替
2. JSX 表达式返回null就是什么都不显示，能够作隐藏某些元素
3. 自定义的组件必须是大写字母开头，普通的html都是小写开头
4. JSX事件名需使用小驼峰法(onClick)
5. JSX 事件监听中若要使用当前实例需绑定this
6. 事件监听时多参数，应将 event 对象放最后一个参数
7. 修改组件状态应该使用 this.setState
8. setState由父类提供，切并非实时，是一个队列修改的形式，因此若是要实时操做能够用在参数使用函数返回上一个setState状态进行下一次修改，屡次setState并不会形成页面的渲染问题，由于只有队列中的最后一次setState才会对组件状态进行改变并渲染到页面中
9. props不能在内部组件进行状态的修改，只能经过父组件修改props的传入引起组件重渲染
10. state和props的区别在于，state是控制组件自己的状态,props是让外部配置组件的状态
11. 没有state是无状态组件，反之则是有状态组件，由于状态会带来管理的复杂性，因此推荐多写无状态组件，少使用有状态组件，提升组件的复用性
12. JSX渲染列表的时候要为每个渲染元素带上key值，通常是后台返回的每个元素的ID,具备惟一性，key的做用主要在于高速渲染DOM
13. state 不可直接修改, 这会让React的状态变得难以追踪
14. 状态提高:当某个状态被多个组件所依赖或影响的时候，应该把这个状态提高到父组件上，子组件经过props接受状态
15. shouldComponentUpdate在作组件性能优化的时候很重要，用于控制组件是否何从渲染，带两个参数 preProps、preState,返回值是 Boolean
16. 组件在注销的时候必须处理未释放的状态值，例如定时器
17. ref能够获取操做DOM，可是尽可能不这么作，除非React自己作不到
18. 经过依赖prop-types来作 props 类型检查

重点

实战

1. 组件复用的时候，当同个页面组件复用超过1次，组件内部清除定时器必须写在 class 内，以static timer = null定义，不然当同页面组件复用超过一次的时候注销组件的时候仍是会发生内存泄漏问题，再强调一下，注销组件的时候应在componentWillUnmounthook 中手动释放 gc 没法自动释放的状态。例如：定时器

代码规范

1. 组件内部私有方法用_开头，事件监听用handle处理，把事件监听的方法传给组件的时候用on开头<Ele onSubmit="this.handleSubmit" />
2. 组件的内容编写顺序以下：

• static开头的类属性，如defaultProps``propTypes
• 构造函数, constructor
• getter/setter
• 组件生命周期hook(componentWillMount,componentDidMount等)
• 私有方法, _*
• 事件监听方法, handle*
• render*开头的方法，有时候render方法会被分配到不一样的render执行，这些函数都以render*开头
• render方法