Shopify Ajax 购物车/基本 Jquery

Question

我正在尝试做这里的购物车： https://www.chubbiesshorts.com/

具体来说，我正在尝试找出 AJAX 购物车。我的目标是能够让客户添加/减去/手动输入数量并让它实时更新购物车（无需重新加载页面）。

我已经能够构建除该功能之外的所有内容。我究竟需要学习什么才能做到这一点？我愿意测试，学习，自己做这项工作。我真的不知道从哪里开始。

显然 Shopify 有一个 AJAX cart API，而我建立商店的主题已经启用了 AJAX 购物车。

我想这只是意味着我需要学习如何调用这些函数并执行它们。

Answer 1

AJAX 购物车 API 页面链接到一个实验室页面，该页面链接到当前的 api.jquery.js，这是一些主题基于其购物车更新的基础。

如果您将该文件放入编辑器并对其进行格式化，您会发现它的阅读效果非常好。您还可以使用 Chrome 的开发者工具来查看和打印文件。

不幸的是，这不是基于事件的 api，因此，例如，如果您覆盖 Shopify.onCartUpdate，您将删除主题所期望的任何内容。

但是，如果您的主题在购物车上做了您想要的更改，但您想提供一种替代方式来更改购物车中的内容（注意示例仅适用于没有行属性：

 $.ajax({
    url:'/cart/update.js', 
    method:'POST', 
    dataType:'json', 
    contentType: "application/json", 
    data:JSON.stringify({updates:{
      variant_id_to_add:1,
      variant_id_to_remove:0,
      variant_id_to_update:3
  }})} ).
  then(function(cart){
Shopify.onCartUpdate(cart);

});