通过ReactJS中的REST服务将数据添加到数据库

Question

我对React开发还很陌生。我正在建立一个购物电子商务网站。以下代码段用于显示产品数据。我正在使用RESTful服务从数据库中提取数据。当我按下“添加到购物车”按钮时，有人可以帮我将这些产品添加到我的数据库中吗？

<div className="row">
  <div className="col-sm-12 col-md-6 col-lg-4 p-b-50">
    {/* Block2 */}
    <div className="block2">
      <div className="block2-img wrap-pic-w of-hidden pos-relative block2-labelnew">
        <img src="images/item-02.jpg" alt="IMG-PRODUCT" />
        <div className="block2-overlay trans-0-4">
          <a href="#" className="block2-btn-addwishlist hov-pointer trans-0-4">
            <i className="icon-wishlist icon_heart_alt" aria-hidden="true" />
            <i
              className="icon-wishlist icon_heart dis-none"
              aria-hidden="true"
            />
          </a>
          <div className="block2-btn-addcart w-size1 trans-0-4">
            {/* Button */}
            <button className="flex-c-m size1 bg4 bo-rad-23 hov1 s-text1 trans-0-4">
              Add to Cart
            </button>
          </div>
        </div>
      </div>
    </div>
    <div className="block2-txt p-t-20">
      <a
        href="product-detail.html"
        className="block2-name dis-block s-text3 p-b-5"
      >
        {groups.map(group => (
          <div key={group.id}>{group.name}</div>
        ))}
      </a>
      <span className="block2-price m-text6 p-r-5">
        {groups.map(group => (
          <div key={group.id}>{group.price}</div>
        ))}
      </span>
    </div>
  </div>
</div>

以下是spring应用程序中的购物车控制器类。

 @PostMapping("/cartadd")
public Cart create(String productName, @RequestBody Map<Integer, Integer> body){
    int id = body.get("id");
    int productid = body.get("productid");
    int userid=body.get("userid");
    String productname=("productname");
    int qty= body.get("qty");
    double total=body.get("total");

    return cartRepository.save(new Cart(id,productid,productname,userid,qty,total));
}

如何将产品数据添加到购物车数据库？例如产品名称，价格等