Im having a trouble on how can I display data in v-for. I've been following this link video link time 9:29
but it show the error cannot read property. It is possbile to the version of laravel? It would be great if anybody could figure out, thank you so much in advance..
Template
<template>
<div>
<h1>The number is : {{views}}</h1>
<button @click="updateCounter(1)">Increase</button>
<button @click="updateCounter(-1)">Increase</button>
<br>
<br><br>
<div v-for ="(user,i) in blogs" :key="i">
<h1>{{user.title}}</h1>
<p>{{user.post}}</p>
</div>
</div>
</template>
Script
<script>
export default {
data(){
return{
views : 0,
blogs : [],
}
},
methods:{
updateCounter(number){
this.views += number;
}
},
created(){
this.views = 100
let posts = [{title: 'this is blog 1', 'post' : 'this is blog post 1', id:1},
{title: 'this is blog 2', 'post' : 'this is blog post 2', id:2},
{title: 'this is blog 3', 'post' : 'this is blog post 3', id:3},
{title: 'this is blog 4', 'post' : 'this is blog post 4', id:4},
,]
this.blogs = posts
}
}
</script>
Your code is fine just remove the extra 'Comma'
Change ,] with ]
On the created function you should use
created(){
this.views = 100
let posts = [{title: 'this is blog 1', 'post' : 'this is blog post 1', id:1},
{title: 'this is blog 2', 'post' : 'this is blog post 2', id:2},
{title: 'this is blog 3', 'post' : 'this is blog post 3', id:3},
{title: 'this is blog 4', 'post' : 'this is blog post 4', id:4}
,]
this.blogs = posts
}
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.