實現這一點有三種可能的方法： 1. **Binding in Constructor:**在 JavaScript 類中，方法默認不被綁定。這也適用于定義為類方法的 React 事件處理程序。通常我們在構造函數中綁定它們。 ~~~js class Component extends React.Componenet { constructor(props) { super(props) this.handleClick = this.handleClick.bind(this) } handleClick() { // ... } } ~~~ 2. **Public class fields syntax:**如果你不喜歡 bind 方案，則可以使用*public class fields syntax*正確綁定回調。 ~~~js handleClick = () => { console.log('this is:', this) } ~~~ ~~~js <button onClick={this.handleClick}> {'Click me'} </button> ~~~ 3. **Arrow functions in callbacks:**你可以在回調函數中直接使用*arrow functions*。 ~~~js <button onClick={(event) => this.handleClick(event)}> {'Click me'} </button> ~~~ **注意：**如果回調函數作為屬性傳給子組件，那么這些組件可能觸發一個額外的重新渲染。在這些情況下，考慮到性能，最好使用`.bind()`或*public class fields syntax*方案。