用ts重写React官方文档里的demo(3)——事件处理

58 阅读1分钟
import React from 'react'

interface Props {

}

interface State {
    isToggleOn: boolean;
}

class LoggingButton extends React.Component<Props, State> {
    // 方法一
    handleClick = () => {
        console.log('this is:', this);
    }

    render() {
        return (
            <button onClick={this.handleClick}>
                Click me
            </button>
        )
    }

    // 方法二
    // handleClick() {
    //     console.log('this is:', this);
    // }

    // render() {
    //     // 此语法确保 'handleClick' 内的 'this' 已被绑定
    //     return (
    //         <button onClick={() => this.handleClick()}>
    //             Click me
    //         </button>
    //     )
    // }
}

export default LoggingButton;