shopify ajax系列产品

我正试图在我的shopify站点上构建一个Vue模块，因此我为集合创建了一个jSON端点：

{% layout none %}
{% paginate collection.products by settings.pagination_limit %}
   {
     "results": {{ collection.products | json }}
   }
{% endpaginate  %}

当我在/collections/collection slug？view=json访问该端点时，我得到了所有产品的完整转储，但当我使用ajax时，我得到的只是没有嵌套产品的集合对象

我的ajax：

$.getJSON('/collections/mens-slip-on?view=json', function(response) {
    console.log(response);
    that.products = response;
  });

我的结果是：

Object {collection: Object}

collection:Object
description:(...)
handle:(...)
id:(...)
image:(...)
products_count:(...)
published_at:(...)
title:(...)
updated_at:(...)

完整的我的Vue组件：

new Vue({
 el: '#filterable',
 data: {
 collection: null,
 products: null
},

mounted() {
  this.initCollection();
  this.fetchProducts();
},

methods: {

initCollection: function() {
  var currPath = window.location.pathname;
  this.collection = currPath.substring(currPath.lastIndexOf('/') + 1);
},

fetchProducts: function() {
  var that = this;

  $.getJSON('/collections/mens-slip-on?view=json',        function(response) {
    console.log(response);
    that.products = response;
  }); 
 }

}

});

Vue.config.devtools = true;

似乎无论我在collection.json.liquid模板中放入什么，它都会返回collection对象

更新：我能够通过使用XHR而不是jQuery来执行ajax调用来解决这个问题。这个问题似乎与jQuery getJSON有关，但我不清楚原因

var httpRequest = new XMLHttpRequest();

  httpRequest.onreadystatechange = alertContents;
  httpRequest.open('GET', '/collections/' + this.collection + '?view=json', true);
  httpRequest.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
  httpRequest.send();

  function alertContents() {
    if (httpRequest.readyState === XMLHttpRequest.DONE) {
      if (httpRequest.status === 200) {
        var response = JSON.parse(httpRequest.responseText);

        parent.products = response.results;
      }
    }
  }

---

我相信你的电话是错的

应该更像

$.getJSON('/collections/mens-slip-on.json', function(response) {
    console.log(response);
    that.products = response;
  });

这将以json格式返回集合对象。如果你想要所有你需要的产品

$.getJSON('/collections/mens-slip-on/products.json', function(response) {
    console.log(response);
    that.products = response;
  });

---

您能添加更多与vuejs相关的代码吗？vuejs代码与此无关，我只是调用一个运行该ajax调用的方法。那么什么是相关的呢？：）当您在Postman中向该api端点发出GET请求时（希望您使用它），您得到了什么？@KevinCompton-uhm。什么？他只是想帮忙，冷静点。我也读了你的问题，还有一些相同的问题。您还没有提供正在生成的json，只有生成的json。。。控制台输出？不清楚这是一个对象，一个对象数组，还是什么。或者object.collections包含什么（非descripp对象除外），唯一相关的是Stackoverflow上的其他人不知道项目的背景和数据结构。如果浏览器返回中访问的端点更正了数据，但jQuery ajax方法没有，那么前端可能有问题-这就是为什么我在Postman和更多前端相关代码中询问响应的原因。就我的2c，祝你好运找到解决方案！不，这不是它的文档记录方式，我使用的是模板开关变量'view=template_name'/collections/mens slip-on/products.json-this products.json端点仅提供30种产品。添加&limit=100，将有更多产品返回