javascript - 单击按钮如何在服务器上运行代码？

Question

我有一个带有 的简单 Next.js 应用程序dummy.js 文件如下:

class Dummy extends React.Component{

    static async getInitialProps(ctx){
        return { dummy : 'abc'};
    }

    displayHelloWorld(params) {
      console.log(params.dummy);
    }

    render() {
        return <button onClick={this.displayHelloWorld(this.props)}>Click Me!</button>
    }
}

export default Dummy;

我使用命令 npm run dev 运行应用程序并转到 localhost:3000/dummy .我期待 displayHelloWorld仅当我单击 Click Me! 时才运行的功能!按钮，但它是在页面加载本身时调用的。

我的目标是在服务器端调用和运行函数(点击按钮)。我怎么做？

Answer 1

写作 <button onClick={this.foo(args)}>...</button>在渲染组件时实际触发该功能一次。

一个简单的解决方案是传递函数回调，例如 onClick={()=>this.foo(args)} .

这将确保每次按下按钮时都会调用该函数。