工作学习总结-vue报错 Cannot read property '__ob__' of undefined(back)

这两天在做公众号这一块,有一个外链页面是用vue写的,总共有三个页面,第一个页面是列表页,第二个页面是详情页,第三个页面是结果页。其他页面的返回作用都很好,就是返回上个页面,上个页面的数据都能展示出来。但是我在第三个页面返回到第二个页面的时候,第二个页面就是空白的页面了,没有数据了。在微信开发者工具看了一下,发现报错了。
报了一个这样的错误

TypeError: Cannot read property '__ob__' of undefined
    at s.e.$destroy (vendor.dll.js:7)
    at destroy (vendor.dll.js:7)
    at _ (vendor.dll.js:7)
    at x (vendor.dll.js:7)
    at s.__patch__ (vendor.dll.js:7)
    at s.e._update (vendor.dll.js:7)
    at s.n (vendor.dll.js:7)
    at It.get (vendor.dll.js:7)
    at It.run (vendor.dll.js:7)
    at Dt (vendor.dll.js:7)

现在用vue开发的人比较多,于是就查了一下这个错误,结果是因为第三个页面没有数据,所以在第三个页面中对于data是这样写的:

data(){},

没有return返回值,所以就报这个错了,记住一定要写return返回值

data(){
    return {}
},

所以data中没有写return返回值,返回上个页面的时候就会报TypeError: Cannot read property ‘ob’ of undefined这个错误。

在我在网上查找解决方法的时候我发现如果循环子组件,返回上一页的时候也会报同样的错误。
例如:我在父组件中循环子组件child

<div v-for="(childData,index) in parentData" :key="index">
   <child data="childData"></child>
</div>

这样返回上个页面的时候也会报TypeError: Cannot read property ‘ob’ of undefined
那怎么解决呢?
这样来写,直接在父组件中这样写:

<child data="parentData"></child>

在子组件中来循环遍历父组件传过来的数据,在子组件中这样写:

<div v-for="(item,index) in data" :key="index">
      <p>{{item.content}}</p>
</div>

这样的话,就避免了在父组件中循环遍历子组件了。
以后有相关的报错的原因的话,我再补充。

发布了130 篇原创文章 · 获赞 103 · 访问量 26万+

猜你喜欢

转载自blog.csdn.net/xiaolinlife/article/details/100656810