0
vueリソース(とajax一般)から始めています。APIにネストされた配列のリストを表示できません。vueリソースを使用してAPI内のネストされたオブジェクトにアクセスする
これは私のサンプルJSONの場合:
{
"item1" : "data",
"item2" : 1234,
"item3" : 5678,
"item6" : "data",
"item7" : [ {
"id" : 0,
"data2" : "testdata",
"data3" : "testdata",
},{
"id" : 2,
"data2" : "testdata",
"data3" : "testdata",
},{
"id" : 3,
"data2" : "testdata",
"data3" : "testdata",
} ]
}
私はこのように私のhtmlでリストをitem7配列を渡したい:
<div id="app">
<ul v-for="item in items">
<li>{{ item.data2 }} {{ item.data3 }}</li>
</ul>
</div>
は、ここに私のJSです:
window.onload = function() {
new Vue({
el: '#app',
data: {
items: {}
},
ready: function() {
this.$http.get('/api/items', function(data) {
console.log(data);
this.items = data.item7[];
});
},
});
};
これは当然、何も返されません。私は、012ueでvueリソースを使って配列をループする方法がわかりません。
ありがとう:
最後に配列であることを行っている場合は、配列として
items
をインスタンス化する必要があります! –