在React组件中创建自定义函数

小编典典

在React组件中创建自定义函数

reactjs

我有一个React组件

export default class Archive extends React.Component { 
   ...
}

componentDidMount和onClick方法部分使用相同的代码，只是参数稍有变化。

是否可以在组件类内部创建一个函数，以便可以在组件范围内重用？

阅读 1040

2020-07-22

共1个答案

小编典典

您可以在react组件中创建函数。实际上是从继承的常规ES6类React.Component。只要小心，然后将其绑定到正确的上下文即可onClick：

export default class Archive extends React.Component {

    saySomething(something) {
        console.log(something);
    }

    handleClick(e) {
        this.saySomething("element clicked");
    }

    componentDidMount() {
        this.saySomething("component did mount");
    }

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

2020-07-22