React应用程序：所有三个按钮都被自己单击，如何防止这种情况发生（新来的反应）

这种情况发生（新来的反应）"/>

React应用程序：所有三个按钮都被自己单击，如何防止这种情况发生（新来的反应）

这是我调用API的函数：底部是两个自动单击的按钮。任何帮助都是非常有帮助的，因为我是一个初学者，对此做出反应和js

postData = m => {
    const config = {
      headers: {
        "Content-Type": "application/json",
        apiRegistrationId: "46",
      },
    };
    const data = {
      referenceNumber: "string",
      sourceRequestId: m
    };

    axios
      .post(
        "",
        data,
        config
      )
      .then((data) => {
        console.log(data.GatewayUrl);
        window.location.href = data.GatewayUrl;
      })
      .catch((err) => {
        console.log(err);
      });
  }

  render() {
    return (
      <div>
        <h1>Donate to the local food shelter</h1>
        <button onClick={this.postData(5)}>Donate $5</button>
        <button onClick={this.postData(10)}>Donate $10</button> 
      </div>
    );
  }
}

export default Home;

只需：

  <button onClick={() => this.postData(5)}>Donate $5</button>
  <button onClick={() => this.postData(10)}>Donate $10</button>