React-報錯Warning：setState(...)on anunmounted component

1、緣由

        這種錯誤通常出如今react組件已經從DOM中移除。咱們在react組件中發送一些異步請求的時候，就可能會出現這樣的問題。舉個例子，咱們在componentWillMount中發送異步請求，當請求成功返回數據，咱們調用setState改變組件的狀態。可是當請求到達以前，咱們更換了頁面或者移除了組件，就會報這個錯誤。這是由於雖然組件已經被移除，可是請求還在執行，因此會報setState() on anunmounted component的錯誤。

2、解決思路

    思路很簡單，咱們只要在react組件被移除以前終止setState操做就能夠了。

3、樣例解決

    （1）定時器，在WillUnmount的時候把按期關閉。

　　    

   （2）處理ajax的時候，這裏以jquery爲例

　　    

    （3）低版本的react和ES5環境下

        利用isMounted()，不建議用isMounted，isMounted在通話前檢查setState確實消除了警告，但也違反了警告的目的，由於如今你永遠不會獲得警告（即便你應該！）並且ES6上isMounted已經被禁止使用。

           

    （4）ES6環境下，推薦使用

           

  （5）fetch請求的處理

        爲了讓Promise能夠被取消，咱們處理的思路是這樣的，咱們在咱們的Promise外面再包裹一層Promise來保證咱們的Promise能夠被取消。   

         

        如今咱們就能夠用makeCancelable來取消咱們的fetch請求了。