善于提取组件,把组件拆分成更小的组件

props 只读。

不要直接修改 state ,应该调用 this.setState()
否则不会重新渲染组件。

构造函数是唯一可以给 this.state 赋值的地方

state 的更新可能是异步的
出于性能考虑,React 可能会把多个 setState() 调用合并成一个调用。
因为 this.propsthis.state 可能会异步更新,所以你不要依赖他们的值来更新下一个状态。
setState() 接收一个函数而不是一个对象。这个函数用上一个 state 作为第一个参数,将此次更新被应用时的 props 做为第二个参数

state 的更新会被合并

React 事件的命名采用小驼峰式(camelCase),而不是纯小写。
使用 JSX 语法时你需要传入一个函数作为事件处理函数,而不是一个字符串。
在 React 中另一个不同点是你不能通过返回 false 的方式阻止默认行为。你必须显式的使用 preventDefault

class 的方法默认不会绑定 this。如果你忘记绑定 this.handleClick 并把它传入了 onClick,当你调用这个函数的时候 this 的值为 undefined

推荐使用 class field 语法或者 bind 语法
用箭头函数 onClick={() => {}} 会导致性能问题

在 JavaScript 中,true && expression 总是会返回 expression, 而 false && expression 总是会返回 false
返回 false 的表达式会使 && 后面的元素被跳过,但会返回 false 表达式。

render 方法直接返回 null,而不进行任何渲染。

key 帮助 React 识别哪些元素改变了,比如被添加或删除。因此你应当给数组中的每一个元素赋予一个确定的标识。
一个元素的 key 最好是这个元素在列表中拥有的一个独一无二的字符串。通常,我们使用数据中的 id 来作为元素的 key
当元素没有确定 id 的时候,万不得已你可以使用元素索引 index 作为 key
如果列表项目的顺序可能会变化,我们不建议使用索引来用作 key 值,因为这样做会导致性能变差,还可能引起组件状态的问题。