首頁 > web前端 > js教程 > 為什麼 `this.setState` 未定義或不是我的 React 事件處理程序中的函數?

為什麼 `this.setState` 未定義或不是我的 React 事件處理程序中的函數?

DDD
發布: 2024-12-18 08:27:11
原創
721 人瀏覽過

Why is `this.setState` undefined or not a function in my React event handler?

在事件處理程序中存取React 實例(this)

問題:

嘗試問題:嘗試

問題:

嘗試

問題:

試試時在事件處理程序中使用this.setState 更新React狀態,您可能會遇到以下錯誤「無法讀取未定義的屬性『setState』」

「this.setState 不是函數」

。這表示 this 關鍵字沒有引用事件處理程序中的元件實例。

說明:
constructor(props) {
  super(props);
  this.state = { inputContent: 'startValue' };
  this.changeContent = this.changeContent.bind(this); // Binding here
}
登入後複製

在ES6 React 元件中,綁定到元件的函數應該定義在建構子或使用this.methodName.bind(this) 在渲染方法中顯式綁定。這是因為 JavaScript 箭頭函數語法(例如 () =>)建立了一個新的函數作用域,並且不會自動將其綁定到元件。

render() {
  return (
    <input onChange={this.changeContent.bind(this)} />
  );
}
登入後複製
解:

方法一(綁定建構子):

方法

方法方法2(渲染中綁定):注意: 使用 React 時。 createClass,所有方法自動綁定到元件上其他修正:在程式碼中,React.refs.someref 應替換為this.refs.someref 以存取React 元素引用。此外,sendContent 方法需要使用上述任何一種綁定方法綁定到元件。

以上是為什麼 `this.setState` 未定義或不是我的 React 事件處理程序中的函數?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板