為什麼我的 React 元件函數中「this」未定義，如何修復它？

處理React 元件函數中未定義的「This」

這個問題源自於一個問題，即「this」在下列元件函數中未定義React 元件。

在提供的範例中，問題出現在 onToggleLoop 函數中。執行此函數時，「this」在元件中未定義。這是因為React不會自動將方法綁定到元件。

要解決這個問題，我們需要使用bind(this)函數在建構函式中手動綁定方法。具體方法如下：

constructor(props) {
  super(props);

  this.state = {
    loopActive: false,
    shuffleActive: false,
  };

  this.onToggleLoop = this.onToggleLoop.bind(this);
}

透過在建構函式中綁定 onToggleLoop 方法，我們確保在執行時，「this」將引用元件實例。這允許我們在該函數中存取組件的狀態和屬性。

一旦進行此更改，「this」物件將不再在 onToggleLoop 函數中未定義，並且您應該能夠更新loopActive狀態符合預期。

以上是為什麼我的 React 元件函數中「this」未定義，如何修復它？的詳細內容。更多資訊請關注PHP中文網其他相關文章！