- 这些 on* 的事件监听只能用在普通的 HTML 的标签上，而不能用在组件标签上。
- 在使用 React.js 的时候，并不需要担心多次进行 setState 会带来性能问题。
- state倾向于管理自己内部的状态，props更倾向于由外部组件传递状态
- 使用map(data, index)中的index作为key标签是不好的做法，这只是掩耳盗铃（具体原因大家可以自己思考一下）。记住一点：在实际项目当中，如果你的数据顺序可能发生变化，标准做法是最好是后台数据返回的 id 作为列表元素的 key。（思考：如果仅仅是静态展示的内容，则直接使用index没有什么大的问题，但是如果是动态渲染的就会出现key与顺序不一致的问题，而且key的值要唯一稳定）
一个可用实践
在不能使用random随机生成key时，我们可以像下面这样用一个全局的localCounter变量来添加稳定唯一的key值。
var localCounter = 1;
this.data.forEach(el=>{
el.id = localCounter++;
});
//向数组中动态添加元素时，
function createUser(user) {
return {
...user,
id: localCounter++
}
}
- 一个状态被多个组件使用依赖的时候就要考虑状态提升了，但是如果提升的层级过高，这时就需要考虑状态管理工具的使用了，比如redux/mobx
-
日常出现的错误，要及时清除定时器，并且不能在已经unmount的组件上调用包含setState操作的方法，否则会出现下列图片出现的错误
image.png - 我们一般会把组件的
state的初始化工作放在constructor里面去做；在componentWillMount进行组件的启动工作，例如Ajax 数据拉取、定时器的启动组件从页面上销毁的时候，有时候需要一些数据的清理，例如定时器的清理，就会放在componentWillUnmount里面去做。
示例
class Post extends Component {
constructor () {
super()
this.state = { content: '' }
}
componentWillMount () {
// 在componentWillMount中拉取数据
this._loadData()
}
async _loadData () {
this.setState({ content: '数据加载中...' })
const content = await getPostData()
this.setState({ content })
}
render () {
return (
<div>
<div className='post-content'>{this.state.content}</div>
<button onClick={() => {
this._loadData()
}}>刷新</button>
</div>
)
}
}
- diff算法参考资料
