當您離開React頁面時，是否需要解除綁定/移除事件監聽器？

Question

我在React製作一個網絡應用程序。我目前有頁面A和頁面B.頁面A有幾個事件監聽器綁定到頁面上的各種元素。但是，當我從頁面A導航到頁面B時，我的控制檯中出現以下錯誤（例如幾秒鐘內的幾十個錯誤）：

Warning：setState（... ）：只能更新已安裝或已安裝的組件。這通常意味着您在卸載的組件上調用了setState（）。這是一個沒有操作。請檢查LandingPageHeader組件的代碼。

我是否需要在我的componentWillUnmount（）函數（頁面A）中解除這些監聽器的綁定？或者還在發生其他事情？另外，這些事件監聽器中的一些綁定到html標籤是否重要？

還應該注意的是，上述事件監聽器的一些事件處理函數確實執行涉及更新/設置React狀態的函數。

Answer 1

是的，您可以在componentWillUnmount中解除綁定事件偵聽器，或在頁面A組件中設置標誌，每次在setState之前檢查此標誌。

componentDidMount() { 
    var _this = this; 
    this._mounted = true; 

    // in listenner function 
    window.addEventListener('resize', funciton() { 
     if (_this._mounted) { 
      _this.setState({}); 
     } 
    }); 
} 

componentWillUnmount() { 
    this._mounted = false; 
}