渲染错误：TypeError：无法读取 laravel vuejs 中未定义的属性标题答案

【问题标题】：Error in render: TypeError: Cannot read property title of undefined In laravel vuejs渲染错误：TypeError：无法读取 laravel vuejs 中未定义的属性标题
【发布时间】：2021-04-18 15:04:09
【问题描述】：

我不知道如何在 v-for 中显示数据。我一直在关注此链接视频linktime 9:29，但它显示错误无法读取属性。 laravel 的版本可以吗？如果有人能弄清楚，那就太好了，在此先感谢您！

模板

    <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>
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>

【问题讨论】：

错字... 您在数组末尾有一个额外的,（在数组中的第四项之后）。你需要删除它，它工作正常。从技术上讲，您有两个额外的,，因为您的第四项是数组中的最后一项。

标签： php laravel vue.js

【解决方案1】：

您的代码很好，只需删除多余的'Comma'

更改,] with ]

【讨论】：

【解决方案2】：

关于你应该使用的创建函数

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
    }

【讨论】：