我面临将类别 SINGLES 相关数据存储到数组中,然后使用该数组显示显示数据的问题。基本上,我只想存储我命名的 json 文件中仅属于类别“SINGLES”的数据“data.json”放入数组中。任何人都可以帮助我吗?我真的很感激。 索引.html
<div id="app">
<div class="col-lg-4 col-sm-6" v-for="model in jsonSingleData">
<div class="beeton-models-box">
<div class="image-holder">
</div>
<div class="text-box">
<h3>{{model.title}}</h3>
<p>{{model.bedrooms}}</p>
</div>
</div>
</div>
</div>
script.js
var vm = new Vue({
el:'#app',
data:{
jsonSingleData:[]
},
created:function(){
this.fetchDataAll();
},
methods:{
fetchDataAll: function(){
var url="data.json";
axios.get(url)
.then(function(res){
res.data.models.forEach(single=>{
if(single.category=='SINGLES')
{
vm.jsonSingleData=single;
console.log(single);
}
});
});
}
下面是我的 json 文件。 数据.json
{
"models": [
{
"title": "IRIS",
"project": "ABC",
"category": "SINGLES",
"bedrooms": 3
},
{
"title": "LILAC",
"project": "ABC",
"category": "DOUBLE",
"bedrooms": 4
},
{
"title": "ASTER",
"project": "ABC",
"category": "SINGLES",
"bedrooms": 4
}
]
}
最佳答案
看起来你的方法缺少一些要点。另外,您在末尾缺少 }
。
试试这个:
fetchDataAll: function(){
var vm = this;
var url="data.json";
axios.get(url)
.then(function(res){
res.data.models.forEach((single)=>{
if(single.category=='SINGLES')
{
vm.jsonSingleData.push(single);
console.log(single);
}
});
});
}
关于javascript - 如何在Vue Js中选择特定的json数据并将其存储到数组中?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/60250599/