關於React中資料獲取為什麼一定要在componentDidMount裡面呼叫？
阿新 • • 發佈：2019-01-27
總結了許多文章，結論如下：
-
constructor()
constructor()中獲取資料的話，如果時間太長，或者出錯，元件就渲染不出來，整個頁面都沒法渲染了。
constructor是作元件state初紿化工作，並不是設計來作載入資料的。
-
componentWillMount()
如果使用SSR（服務端渲染）,componentWillMount會執行2次，一次在服務端，一次在客戶端。而componentDidMount不會。
constructor可以完成state初始化，componentWillMount使用的很少，目前16版本加入了UNSAFE來標識componentWillMount，新的生命週期
static getDerivedStateFromProps()也會替代這個。React16之後採用了Fiber架構，只有componentDidMount宣告周期函式是確定被執行一次的，類似ComponentWillMount的生命週期鉤子都有可能執行多次，所以不加以在這些生命週期中做有副作用的操作，比如請求資料之類。
-
render()
無限render
-
componentDidMount()
確保已經render過一次。提醒我們正確地設定初始狀態，這樣就不會得到導致錯誤的"undefined"狀態。
componentDidMount方法中的程式碼，是在元件已經完全掛載到網頁上才會呼叫被執行，所以可以保證資料的載入。此外，在這方法中呼叫setState方法，會觸發重渲染。所以，官方設計這個方法就是用來載入外部資料用的，或處理其他的副作用程式碼。
可以參考：