shoplline 点击某个按钮添加产品到购物车

{{assign "product_form_id" (append "product-form-" section.id)}}
<product-form
   id="{{append product_form_id '__wrapper'}}"
       class="product-form"
       data-default-error-message="{{t 'products.general.no_product_data_found'}}"
       >
   <form method="post" action="/api/carts/ajax-cart/add.js" id="productFrom" id={{product_form_id}}>
    <input type="number" required step="1" form="product-form-{{section.id}}" name="quantity" min='1' max='999' value='1'/ hidden>
           <input type="hidden" name="id" value="{{default product.selected_or_first_available_variant.id (get 'id' (first product.variants))}}" disabled  class="ids"/>
   <button class="product-right-cart-button" type="submit"  name="add"  id="{{product_form_id}}-submit">
       {{snippet "carticon"}}
   </button>
   <div class="loading-overlay__spinner">
       <svg class="icon icon-loading" width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
       <path d="M18.3337 9.99984C18.3337 14.6022 14.6027 18.3332 10.0003 18.3332C5.39795 18.3332 1.66699 14.6022 1.66699 9.99984C1.66699 5.39746 5.39795 1.6665 10.0003 1.6665" stroke="currentColor" stroke-width="2.5" stroke-linecap="round"></path>
       </svg>

       </div>
     </form>
   </product-form>