无法通过 onClick 事件反应传递数据

Question

我尝试通过单击按钮将“价格”发送到 MongoDB。后端工作正常，因为我可以通过邮递员存储数据，

React 代码：

import axios from "axios";
const Package = (props) => {
//const [price, setPrice] = useState();
//console.log(price);
const handlePayment = (e) => {
console.log(e);
const result = axios.post("http://localhost:3000/pay", e);
console.log(result);
};
return (
<>
  <div className="col-lg-4 col-md-6 col-sm-10 pb-4 d-block m-auto">
    <div className="pricing-item">
      <div className="pt-4 pb-3">
        <h4>{props.name}</h4>
      </div>

      <div className="pricing-price pb-1 text-primary color-primary-text ">
        <h1>
          <span>{props.price}</span>
        </h1>
      </div>
      <div className="pricing-description">
        <ul className="list-unstyled mt-3 mb-4"></ul>
      </div>
      <div className="pricing-button pb-4">
        <button
          onClick={() => handlePayment(props.price)}
          type="button"
          className="btn btn-lg btn-primary w-75"
        >
          Buy
        </button>
      </div>
    </div>
  </div>
</>
);
};

但是，通过 React 存储在数据库中的唯一内容是日期和 Id。

请给我一些建议，以将正确的数据传递给数据库

Answer 1

试试这个

const handlePayment = async (e) => {
   console.log(e);
   const result = await axios.post("http://localhost:3000/pay", e);
   console.log(result);
};