164
rated 0 times
[
167]
[
3]
/ answers: 1 / hits: 18141
/ 6 Years ago, wed, november 14, 2018, 12:00:00
I have a fixed JSON array that contains 3 arrays. After the JSON has been fetched I am trying to merge them into one array. Here is what I have attempted but the Vue.JS array seems empty.
PREVIOUS
this.items = items;
NEW ATTEMPT
this.items = items.concat.apply([], arrays);
I have put an example of the 3 page demo at the link below:
<body>
<!-- Page List -->
<div class=container text-center mt-5 id=app>
<h1 class=display-4>Vue Page Output:</h1>
<!--<h2>{{items[0][0].page1}}</h2>-->
<h2>{{items.page1}}</h2>
</div>
<div class=container text-center mt-5>
<h3>Other Pages</h3>
<a href=products.html>Products</a>
<a href=contactus.html>Contact Us</a>
</div>
<!-- /.container -->
<script type=text/javascript>
const app = new Vue({
el: '#app',
data: {
items: []
},
created: function () {
fetch('test.json')
.then(resp => resp.json())
.then(items => {
this.items = items.concat.apply([], arrays);
})
}
});
</script>
</body>
JSON
[
[
{
page1: Company Name
}
],
[
{
products: Product List
}
],
[
{
contactus: Contact Us at Acme Corp
}
]
]
DESIRED JSON OUTPUT
JSON
[
{
page1: Company Name
},
{
products: Product List
},
{
contactus: Contact Us at Acme Corp
}
]
More From » arrays
