Vue components Cannot read property '__ob__' of undefined

最新推荐文章于 2025-06-16 16:12:35 发布
最新推荐文章于 2025-06-16 16:12:35 发布
阅读量3.1k 收藏 2
点赞数 3
CC 4.0 BY-SA版权
文章标签： components vue ob
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/WongRu1/article/details/78653162
本文描述了一个Vue项目中由于疏忽未在data中返回数据而导致的问题及解决过程。作者通过逐步排查，最终发现是因为data中缺少return关键字。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

最近使用vue重构项目遇到一个问题，困扰了2天

这里写图片描述

点击搜索后页面显示搜索结果，此时调用组件列表

这里写图片描述

列表渲染之后，显示当前列表，再点击清除按钮还原搜索前状态，即图1

这里写图片描述

此时报错如下：Cannot read property ‘ob’ of undefined

这里写图片描述

因为列表组件由另一同事缩写，个人也粗心并没有多看，从头触发排除

这里写图片描述

试着用div方式去循环，发现并没有报错，锁定问题出现在Newslists组件中，
最终排查原因并不是数据出错，只是一个简单的data中没有写return!

这里写图片描述

一个简单的return 困扰了很长时间，也找过网上有人所说的主页调用子组件，需要把 list[] 传入组件中，在组件中循环，也试过此方式发现并没有用。

最后总结：开发过程需严谨，开发时间浪费在return上确实有点难受呀！！！

WongRu1
关注
Vue源码分析——第二章
Lee的博客
09-10 613
/* * Object.defineProperty(person,'name',{ configurable:false,//能否使用delete、能否需改属性特性、或能否修改访问器属性、，false为不可重新定义，默认值为true 是否可以编辑 enumerable:false,//对象属性是否可通过for-in循环，flase为不可循环，默认值为true 是否可以枚举遍历 writable:false,//对象属性是否可修改,flase为不可修改，默认值为true value.
Uncaught TypeError: Cannot read property ‘Component‘ of undefined
weixin_43478936的博客
08-17 1475
Cannot read property ‘Component’ of undefined 1.问题描述 2.解决方案 问题描述 上一篇文章中在本地搭建了第一个React项目后,跟着react中文文档学习,封装时钟的外观代码如下 class Clock extends React.Component { constructor(props) { super(props); this.state = {date: new Date()}; } render() { ret
TypeError: Cannot read property ‘__ob__‘ of undefined-（已解决）
weixin_44159171的博客
12-18 648
问题描述： 编辑vue项目时，报错：TypeError: Cannot read property '__ob__' of undefined 页面不能正确跳转 原因分析： 这是因为在.vue文件里面的export default {}里面，写了data(){}，但是却没写return{} ![在这里插入图片描述](https://img-blog.csdnimg.cn/2020121809533986.png) 解决方案： 只需要在缺少方法的地方加上相关的return{}即可恢复正常 问题
uniapp——uniapp报错：Cannot read property ‘components‘ of undefined
最新发布
qq_43201350的博客
06-16 298
uniapp——uniapp报错：Cannot read property 'components' of undefined
vue出现TypeError: Cannot read property '__ob__' of undefined的解决
weixin_40300591的博客
04-09 9875
TypeError: Cannot read property ‘ob’ of undefined 因为在组件 ComponentA 中保留无效的 data(){}, 组件 ComponentA 根据条件加载或销毁，即带有 v-if，当 Component 销毁时会出现上述问题，去掉 data(){} 或者写正确 就没解决。 ...
Vue中data没有写return报Cannot read property ‘__ob__‘ of undefined错误
觉醒法师的专栏
07-30 746
最近需到一个在开发中很常见错误，原因是自己开发时没仔细检查代码，删除数据时把data中return一并删除了，导致路由跳转点击无反应。data函数在Vue中是一个特殊的方法，用于定义组件的本地状态。经翻阅相关文档，了解到它应该返回一个对象，该对象包含在组件中使用的各种数据属性。如果您的data函数没有返回任何东西（或者返回null或一个非对象值），那么您可能会看到类似的错误消息，指示数据未定义或未预期的类型的错误。确保您的data函数始终返回一个对象，以包含您需要在组件中使用的数据属性。
VUE 遇到"Cannot read property '__ob__' of undefined" 的解决办法！
weixin_40542544的博客
04-16 1375
记不清第n次遇到这个错误了，但是脑子就是不好用，记不住解决办法啊，每次都要找好久才能找到错误，网上还一篇篇的全是错误答案…所以写篇随笔，记录下，方便大家也方便我自己。 网上有人说是组件循环了多次一直没有销毁会产生这个错误，经测试发现并不是这个原因（也许是我测试的有问题？），遇到这个问题很简单，就是脚手架中 数据要这么写 data(){ return {} } 往出现上述错误的问题，都是你...
Vue 09Vue中使用行内样式---class
mqingo的博客
01-02 2925
09Vue中使用样式---class.html <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>09Vue中使用样式----class</title> <script type="text/javascript
Vue(v2.6.11)万行源码生啃，就硬刚！
掘金安东尼
07-06 2142
玩归玩，闹归闹，Vue 源码要知道。
Vue 品牌列表的删除
mqingo的博客
01-03 702
品牌列表的删除.html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0&quo
Vue 品牌列表padStart方法的使用
mqingo的博客
01-04 665
06品牌列表padStart方法的使用.html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-s
vue 报错 data functions should return an object: 和 Cannot read property '__ob__' of undefined
热门推荐
时光的博客
10-13 4万+
在vue里出现ata functions should return an object: 和 Cannot read property '__ob__' of undefined   报错是因为在 data () {},里没有返回(return)  需要写成 data(){ return{ }  }  就算没有数据也要写返回一个对象 (return)    ...
工作学习总结-vue报错 Cannot read property '__ob__' of undefined(back)
时清云的博客
09-09 940
这两天在做公众号这一块，有一个外链页面是用vue写的，总共有三个页面，第一个页面是列表页，第二个页面是详情页，第三个页面是结果页。其他页面的返回作用都很好，就是返回上个页面，上个页面的数据都能展示出来。但是我在第三个页面返回到第二个页面的时候，第二个页面就是空白的页面了，没有数据了。在微信开发者工具看了一下，发现报错了。 报了一个这样的错误 TypeError: Cannot read prope...
Vue2.0项目报错TypeError: Cannot read property ‘__ob__‘ of undefined
duyy1990的博客
02-10 641
Cannot read property '__ob__' of undefined
TypeError: Cannot read property ‘__ob__‘ of undefined
每日秃头
10-20 167
出现这个问题是因为.vue文件里面export default {}写了data(){} 却没写return{} export default { data(){} }
vue 报错 Cannot read property ‘__ob__‘ of undefined的解决方法
asdfgh0077的博客
10-09 519
vue 报错 Cannot read property '__ob__' of undefined的解决方法
Vue遇到“Cannot read property ‘__ob__‘ of undefined“ 的解决办法
valsedefleurs的博客
04-26 380
如果data里面没有return 哪怕data(){}里面什么数据都没有，也会发生这个错误。报错是因为我在点击切换页面的时候，页面路由没有问题，但是页面切换不过去。脚手架的data方法要这么写，因为实例化Vue的过程中data函数b。新编写一个Vue组件，编译报错，页面无法显示。
vue Cannot read property ‘meta‘ of undefined
07-28
这个错误是因为在Vue组件中，你尝试读取一个未定义的属性。具体来说，错误信息是"TypeError: Cannot read property ‘meta‘ of undefined"。根据你提供的引用内容，我可以看到你在Vue实例的data属性中定义了一个名为editSmall的对象，但是在模板中尝试读取editSmall.lang.meta属性时出现了问题。根据引用\[1\]和引用\[2\]的内容，这个错误可能是因为在绑定数据时，你的lang属性被赋值为空对象，导致lang对象中的meta属性为undefined。为了解决这个问题，你可以在初始化时为editSmall.lang属性赋值为空对象，就像引用\[3\]中的代码所示。这样，当模板中尝试读取editSmall.lang.meta属性时，就不会出现"Cannot read property ‘meta‘ of undefined"的错误了。 #### 引用[.reference_title] - *1* *2* *3* [vue报错TypeError: Cannot read property ‘Name‘ of undefined的解决方案](https://blog.youkuaiyun.com/Misnice/article/details/107496156)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^koosearch_v1,239^v3^insert_chatgpt"}} ] [.reference_item] [ .reference_list ]
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值