反應：無法從窗體上的onchange事件處理程序設置狀態選擇

我有一個像這樣構造的反應組件。我想從下拉列表中選擇用戶的選擇。反應：無法從窗體上的onchange事件處理程序設置狀態選擇

我收到以下錯誤消息，當我嘗試：

「遺漏的類型錯誤：無法讀取的未定義的屬性‘的setState’」

我下面的文檔的例子，所以我在哪裏我錯了？

export default class SearchPage extends Component { 

.... 

handleChange(e) { 
    this.setState({ 
     params: { 
      ...this.state.params, 
      [e.target.name]: e.target.value 
     } 
    }) 
} 

render() { 
    const { county, cause, activity } = this.state 

    return (
     <div className="searchpage"> 
      <form> 
       <select name="county" onChange={this.handleChange} 
       .....

來源

2016-06-09 simbro

handleChange未綁定到實例。你需要要麼使用內聯函數的箭頭，將捕獲this詞法

<select name="county" onChange={e => this.handleChange(e)}

或（推薦的方式）構造函數中綁定的方法。

constructor() { 
    super(); 
    this.handleChange = this.handleChange.bind(this); 
}

來源

2016-06-09 11:49:42

我現在正在使用_.bind（this）_解決方法，但它拋出linting錯誤，顯然使用_.bind（this）_對性能來說是相當糟糕的。使用_onChange = {e => this.handleChange（e）} _似乎是最好的選擇 - 謝謝Yury！ – simbro

如果在構造函數中執行一次，則綁定即可。 https://facebook.github.io/react/docs/reusable-components.html#no-autobinding –

實際上這是一個很好的方法，只是嘗試在構造函數中綁定，運行良好 – simbro

這是另一種伎倆，以避免與.bind結合你的函數（本），或者一些裝飾或創建類似匿名函數（）=> MYFUNC（）

handleChange => (e) { }

然後你可以使用它作爲你想在裏面

來源

2016-06-09 11:59:16

反應：無法從窗體上的onchange事件處理程序設置狀態選擇

回答

相關問題