Vue.js v-for循环数据获胜'；不显示

我无法使我的v循环显示对象数组中的数据。我从API上得到的。这很简单，我相信它应该会起作用。所以我想知道是不是别的原因。API未打开，因此下面是一个图像：

{{x.title}}
新Vue({
el:“#自助餐”，
数据（）{
返回{
产品：[]
}
},
挂载（）{
axios.get（）https://ebuffet-dk.myshopify.com/admin/api/2020-01/products.json')
.然后（response=>（this.product=response.data.products））
.catch（错误=>{console.log（错误）；}）；
}
});

---

我知道也有类似的例子，我也试着遵循它们。所以我只是问，因为我不确定这是我自己的错，还是shopify的错。

对未来的任何人来说都是好的。问题是shopify正在通过{{}。这意味着我的代码无法工作

但我偶然发现了一个解决方案

---

你是v-因为这是真的，但它不起作用，因为没有任何数据

此代码错误**this.product=response.data.products**

您不能提供等于arry的obj，您应该将obj推送到数组中

---

this.product.push（response.data.products）

api需要凭据，您能给出它包含什么的示例吗？控制台中有错误吗？请求是否正确返回？很抱歉。我拍了一张照片。控制台中没有错误。数据就是无法显示。我可以让它循环出50个空div，但是没有任何内容。你看到一些

{{x}

的内容吗？

<div class="" id="buffetfeatured">
    <div v-for="x in product">{{ x.title }}</div>
</div>

<script type="text/javascript">
    new Vue({
        el: '#buffetfeatured',
        data() {
            return {
                product: []
            }
        },
        mounted () {
            axios.get('https://ebuffet-dk.myshopify.com/admin/api/2020-01/products.json')
                .then(response => (this.product = response.data.products))
                .catch( error => { console.log(error); });
        }
    });
</script>