小编kys*_*nic的帖子

我知道这不是推荐的方法，但无论如何我很好奇如何通过功能组件和挂钩来完成它。考虑以下示例：

class SimpleComponent extends Component {
    method1 = () => {
        console.log('Method 1');
    };

    method2 = () => {
        console.log('Method 2');
    };

    renderMessage2() {
        return (
            <div onClick={this.method2}>Message 2</div>
        );
    }

    render() {
        return (
            <div>
                <div onClick={this.method1}>Message 1</div>
                {this.renderMessage2()}
            </div>
        );
    }
}

class EnhancedComponent extends SimpleComponent {
    method1 = () => {
        console.log('Enhanced Method 1');
    };

    method2 = () => {
        console.log('Enhanced Method 2');
    };

    renderMessage2() {
        return (
            <div onClick={this.method2}>Enhanced Message 2</div>
        );
    }
}

我们如何通过功能组件和钩子来实现这样的行为？