使用 ajax 购物车数据未在 shopify 中更新

Question

我在 Shopify 中遇到问题。

我想使用 ajax 在点击按钮时更新购物车数量，但它会出现类似

的错误

{"status":404,"message":"Cart Error","description":"Cannot find variant"}

这是我的 ajax 代码，

 $('.adjust-plus').click(function(){
    var qty = $(this).parent('.button-wrapper').siblings('.input-wrapper').children('.quantity').val();
    var varient = $(this).parent('.button-wrapper').siblings('.input-wrapper').children('.quantity').attr('data-id');

    jQuery.ajax({
      type: 'POST',
      async: false,
      url: '/cart/update.js',
      data: { updates: { varient : qty } },
      dataType: 'json',
      success: function() { location.href = '/cart'; }
   });
 });

目前在两个变量值中都出现，因此值没有任何错误。

but when id add code like:

$('.adjust-plus').click(function(){
    var qty = $(this).parent('.button-wrapper').siblings('.input-wrapper').children('.quantity').val();
    var varient = $(this).parent('.button-wrapper').siblings('.input-wrapper').children('.quantity').attr('data-id');

    jQuery.ajax({
      type: 'POST',
      async: false,
      url: '/cart/update.js',
      data: { updates: { 15082896588867 : 2 } },
      dataType: 'json',
      success: function() { location.href = '/cart'; }
   });
 });

然后购物车更新成功。

Answer 1

首先，删除 async: false，因为这是非常糟糕的做法，这里不需要，因为您正在正确使用 success 回调。

问题本身是因为您不能使用您正在使用的语法将变量用作对象的键。要解决这个问题，您可以使用括号表示法，如下所示：

$('.adjust-plus').click(function() {
  var $quantity = $(this).parent('.button-wrapper').siblings('.input-wrapper').children('.quantity');
  var qty = $quantity.val();
  var varient = $quantity.data('id');

  var data = { updates: {} };
  data.updates[varient] = qty;

  jQuery.ajax({
    type: 'POST',
    url: '/cart/update.js',
    data: data,
    dataType: 'json',
    success: function() { 
      location.href = '/cart'; 
    }
  });
});

使用 ajax 购物车数据未在 shopify 中更新

cart data not update in shopify using ajax

javascript

jquery

shopify

shopify-template