Javascript 如何解决：[Vue warn]：在Vue.js 2上渲染组件时出错？

我的组件代码（SearchResultView.vue）如下所示：

<template>
    ...
</template>

<script>

    export default{
        props:['search','category','shop'],
        created(){
            ...
        },
        data(){
            return{
                loading:false
            }
        },
        computed:{
            list:function(){
                var a = this.$store.state.product;
                a = JSON.stringify(a)
                a = JSON.parse(a)
                console.log(a.list[12])
                ...
            }
        },
        methods:{
            ...
        }
    }
</script>

console.log(a.list[12].name)

在控制台上，存在如下错误：

[Vue warn]：在C:\xampp\htdocs\chelseashop\resources\assets\js\components\SearchResultView.Vue中呈现组件时出错：

未捕获的TypeError:无法读取未定义的属性“name”

---

如何解决该错误？

因为它是一个计算错误，所以它的值可能会在程序的生命周期内发生变化。在尝试从中获取成员之前，您应该检查以确保

a.list[12]

存在

if (a.list[12])
    console.log(a.list[12].name);

---

因为它是计算的，所以它的值可能会在程序的生命周期中发生变化。在尝试从中获取成员之前，您应该检查以确保

a.list[12]

存在

if (a.list[12])
    console.log(a.list[12].name);

---

由于这是一个渲染问题，您需要向我们提供您使用的模板。最可能的情况是，您在加载数据之前访问了数据，或者传递了错误的属性：

console.log（JSON.stringify（a.list[12]）

？@Saurabh，

{“id”：12，“name”：“Bunga Gandeng”，“photo”：“bunga6.jpg”，“price”：762913，“stock”：36，“total_selled”：54，“total_view”：0，“weight”：68，“store_id”：1，“shop_name”：“Bunga Airi”，“格式化的_地址”：“Kemang”}

正如@FrankProvost所说，请添加您的模板。问题似乎就在这里，我还假设在

列表

函数的末尾您返回了一个值，但您能添加整个函数体吗？尝试分配

控制台.log（a.list[12]）

这样的变量：

var z=console.log（a.list[12]）

然后使用

z.name

并告诉我之后的输出是什么。由于这是一个呈现问题，您需要将您使用的模板保密给我们。很可能您在加载数据之前访问了数据，或者您传递了假属性：

console.log（JSON.stringify（a.list[12]）

？@Saurabh，

{id:12，“名称“：”Bunga Gandeng“，”照片“：”Bunga 6.jpg“，”价格“：762913，“库存“：36，“总售出量”：54，“总浏览量”：0，“重量”：68，“店铺id”：1，“店铺名称“：”Bunga Airi“，”格式化地址“：”科芒“}

正如@FrankProvost所说，请添加您的模板。问题似乎就在这里，我还假设在

列表

函数的末尾，您正在返回一个值，但您能否添加整个函数体？请尝试将

console.log（a.list[12]）

赋值给如下变量：

var z=console.log（a.list[12]）

然后使用

z.name

并告诉我之后的输出是什么。