Vuejs2 Vue.js（v.2）仅在单击按钮后加载（获取）数据

我是VUE的初学者，我编写了代码，在加载网页后，从json下载数据，并用id“app”将其呈现给wonder

但是，我需要的数据加载不是在开始，而是只有在点击按钮后

非常感谢您的提示和建议

const-app=新的Vue({
el:“#应用程序”，
数据：{
URL前缀：“”，
新名称：“”，
新说明：“”，
新专家建议：''，
新产品\u效益\u 2:“”，
新图像：“”，
人物：[{
}
],
},
方法：{
添加（）{
这是推({
姓名：this.newName，
description:this.newDescription，
专家建议：这是新的专家建议，
产品利益：这个。新产品利益，
图片：这个，新图片，
})
}
},
已创建：函数（）{
获取（'./data.json'）
.then（res=>res.json（））
.然后（json=>this.characters=json）
}
})

试验
获取数据
{{item.name}
{{item.description}}

{{item.product_benefit_2}}
{{item.experts_advice}

首先，您应该在方法中创建方法来获取数据

methods: {
  yourNewMethodToFetchData() {
    fetch('./data.json')
    .then(res => res.json())
    .then(json => this.characters = json) 
  }
}

第二次向“获取数据”按钮添加单击事件，如下所示：

<button @click="yourNewMethodToFetchData">Fetch data</button>

---

有很多关于Vue的文档、Vue的食谱、指南和大量文章。你们会从他们身上学到很多。@ŠtevoKelbel若这解决了你们的问题，你们可以做出被接受的答案。我建议您快速浏览vuejs文档，至少是基本部分

created: function(){
    
}