React componentwillmount和componentdidmount请求数据

共计 549 个字符，预计需要花费 2 分钟才能阅读完成。

1. 清楚调用顺序

2.componentWillMount 的问题
这个方法正确调用的时候是在 component 第一次 render 之前, 所以第一眼看上去觉得就应该在这里去 fetch datas. 但是这里有个问题, 在异步请求数据中这一次返回的是空数据（null）, 因为是异步的, 请求需要时间, 但 render 不会等你慢慢请求. 所以在渲染的时候没有办法等到数据到来. 正确的处理方式就不要在这里请求数据, 而是让组件的状态（state）在这里正确的初始化. 顺便说一句在 es6 中, 使用 extend component 的方式里的 constructor 函数和 componentWillMount 是通用的作用, 所以你在构造函数里初始化了组件的状态就不必在 WillMount 做重复的事情了.
3.componentdidmount 的优点
componentDidMount 呢? 这个生命周期函数在是在 render 之后调用一次,component 已经初始化完成了.
在生产时,componentDidMount 生命周期函数是最好的时间去请求数据, 其中最重要原因: 使用 componentDidMount 第一个好处就是这个一定是在组件初始化完成之后, 再会请求数据, 因此不会报什么警告或者错误, 我们正常请教数据完成之后一般都会 setState.