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方法