Vue __ob__: Observer

最新推荐文章于 2024-07-26 20:46:33 发布
最新推荐文章于 2024-07-26 20:46:33 发布
阅读量350 收藏
点赞数
分类专栏： 心得 文章标签： javascript vue
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_42460322/article/details/107398333
版权

ob: Observer这个属性出现之后，如果单独拿数据的值，就会返回undefined。

ob_: Observer这些数据是vue这个框架对数据设置的监控器，一般都是不可枚举的。

JavaScript中的可枚举和不可枚举
在JavaScript中，对象的属性分为可枚举和不可枚举之分，它们是由属性的enumerable值决定的。可枚举性决定了这个属性能否被for…in查找遍历到。如果写到了，会显示undefined

追逐星星的人
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
Vue.js原理分析之observer模块详解
12-12
介绍 observer是Vue核心中最重要的一个模块（个人认为），能够实现视图与数据的响应式更新，底层全凭observer的支持。 注意：本文是针对Vue@2.1.8进行分析 observer模块在Vue项目中的代码位置是src/core/observer，模块共分为这几个部分： Observer: 数据的观察者，让数据对象的读写操作都处于自己的监管之下 Watcher: 数据的订阅者，数据的变化会通知到Watcher，然后由Watcher进行相应的操作，例如更新视图 Dep: Observer与Watcher的纽带，当数据变化时，会被Observer观察到，然后由Dep通知到Wa
解决vue的{__ob__: observer}取值问题
darabiuz的博客
02-01 2309
转载原地址：https://blog.csdn.net/zhouzuoluo/article/details/103067637?utm_medium=distribute.pc_relevant.none-task-blog-baidujs_title-6&spm=1001.2101.3001.4242 问题： 　　vue编码中经常出现获取到的数据是：{ob: Observer} 格式的 解决方法： 　　将返回的数据data先转换为JSON字符串形式，然后再从字符串形式转换成JSON格式J
vue中__ob__: Observer取不到值？谈谈vue中__ob__: Observer的理解
qq1114565087的博客
08-02 747
然后你很奇怪为什么console有数据，这就是开头说的vue的数据监控，你能console出这个数据是因为vue对这个数据设置的监控器，这个数据被改变将会输出改变的最终值，然后控制台看到的就是你请求的返回数据了，但是请求比较长的话还是会console出undefined的具体这个时间差是多少就不知道了也不是很重要了，检查一下自己的业务代码吧,还有其它情况也有可能会出现。这个解释有点书面，很多人不太知道为什么要监控，我其它地方也是正常的数据为什么又可以枚举，为什么这里就这样拿不到值了。...
Vue数组中出现__ob__:Observer无法取值问问题（已解决）
禾日香的博客
02-14 765
需要在渲染子组件前等待数据的出现。亲测已经解决！
Vue 数组中出现__ob__: Observer无法取值[已解决]
热门推荐
聪明不喝牛奶的博客
10-31 2万+
问题说明 在开发项目中经常要从数据库中拿到数组然后复制给新的数组使用，但是会发现有时候会发现带有 __ob__: Observer 数组后缀的就是没有办法取到值，更可怕的是 console.log 却能看得到值。数组如下图所示： 解决问题 那么针对这样的问题博客上基本上都是说要将数组转化成string对象运用这个JSON.parse(JSON.stringify(数组))再进行赋值，然后一顿操作数组变成空！！！ 说实话根本不是这个原因，哎被坑了一下午！ 那么首先先解释一下为什么数组后面会出现__ob__:
{__ob__: observer}取值为undefined问题解决
SiaEyre
06-06 8652
操作数据库返回的数据时，发现访问属性值为undefined 解决方法如下： 将返回的数据data先转换为JSON字符串形式，然后再从字符串形式转换成JSON格式JSON.parse(JSON.stringify(data)) var self = this; var query = new AV.Query("MenuItem"); query.find("na...
Vue数组中__ob__: Observer无法获取数据的解决办法
小龙狗的博客
12-04 4971
Vue数组中__ob__: Observer无法获取数据的解决办法
__ob__: Observer 后缀的数组的取值方式
pig_ning的博客
08-15 3784
__ob__: Observer 后缀的数组的取值方式
关系vue的{__ob__: observer}取值问题
辽辽无期的博客
06-16 439
注意： 如果获取的值为空，将取值的方法改成同步。
简单实现Vue的observer和watcher
11-28
`observer` 是 Vue 内部用来深度遍历并监视数据对象的工具。它通过调用 `Object.defineProperty` 在每个属性上设置 getter 和 setter。当读取属性值时，getter 会被触发；当设置新值时，setter 会被调用，从而允许 ...
Vue 源码分析之 Observer实现过程
08-27
Observer 类在Vue的响应式系统中扮演着至关重要的角色，它是数据观测的基石。当Vue实例化时，会对传入的`data`选项进行处理，将数据转化为响应式的。在这个过程中，`Observer`的主要任务是对数据对象进行深度遍历，...
vue源码分析1
08-08
它会对传入的数据对象进行遍历，如果发现某个属性值`value`下没有`__ob__`属性（`__ob__`是Vue内部用于标记对象已被观察的标志），则会调用`Observer`构造函数对这个属性进行观测。`Observer`的工作是将普通...
【vue】解决{‘查看‘, __ob__: Observer}取值问题
想想挺好啊
08-05 635
对于产生__ob__:Observer这种数据类型，其实是Vue监控变量产生的，在向数组中添加数据使用 push添加的对象信息就会出现__ob__: Observer。
Vue中出现最多的“undefined”错误，检查原因以及解决办法（亲测有效）
m0_70545163的博客
09-04 1万+
摘要：本文主要来讲讲vue中出现最多的"undefined"错误。
关于Vue对象取属性值undefined
yuxuan89814的专栏
05-25 1万+
记一次 Vue 关于对象取属性值报错 昨天写Vue前端代码，卡在了一个点上，取对象值，是存在的，但是存对象的属性值，一直undefined的。为此苦恼很久。 结果是因为，属性写错了，写错的点是，后端mock的数据对象，在Vue mounted中请求后端数据传递到前端的。在后台传入的mock数据，误写为： “name:”:value 多了：分号 导致前端取对象属性name，data.name 取不到值，当时还信心满满认为肯定是Vue组件周期导致的取不到属性值，网上搜索半天，压根没考虑到是属性名字写错的这个最简
{__ob__: Observer }的解决方式
weixin_47389477的博客
07-30 9532
在操作数据的时候发现，ob: Observer这个属性出现之后，如果单独拿数据的值，就会返回undefined。于是就到网上查相关的资料，发现__ob__: Observer是vue一个很重要的知识点。 数据对象的 ob 属性 ######## 原因 ob: Observer这些数据是vue这个框架对数据设置的监控器，一般都是不可枚举的。 网上有很多解决的方案： 第一种：ob: Observer 是 Vue 对数据监控添加的属性，如果想去掉可以用赋值的方式。例加粗样式如Object.assign({},th
javaScript Object.defineProperty 详解，及vue2中Observer解析
m0_37824255的博客
04-03 1658
Object.defineProperty 直接在一个对象上定义一个新属性，或者修改一个对象的现有属性，并返回此对象; 备注：应当直接在 Object 构造器对象上调用此方法，而不是在任意一个 Object 类型的实例上调用。 /** * obj { Object } 必传，目标对象（要定义属性的对象） * prop { String | Symbol } 必传， 需定义或修改的属性的名字 * descriptor { Object } 必传， 要定义或修改的属性描述符 * configura
JavaScript青少年简明教程：函数及其相关知识（下）
最新发布
cnds123的专栏
07-26 650
JavaScript青少年简明教程：函数及其相关知识（下）
将[0 : {__ob__: Observer} 1 : {__ob__: Observer} 2 : {__ob__: Observer}] 处理成一个数组对象
06-01
这个数据看起来像是 Vue.js 的响应式数组对象。如果想将其处理成一个普通的数组对象，可以使用 `Array.from()` 方法或者展开运算符 `...`，示例如下： ```javascript const originalArr = [ {__ob__: Observer}, {__ob__: Observer}, {__ob__: Observer} ]; // 使用 Array.from() 方法 const newArray1 = Array.from(originalArr); console.log(newArray1); // [{__ob__: Observer}, {__ob__: Observer}, {__ob__: Observer}] // 使用展开运算符 ... const newArray2 = [...originalArr]; console.log(newArray2); // [{__ob__: Observer}, {__ob__: Observer}, {__ob__: Observer}] ``` 以上两种方法都可以将响应式数组对象转换成普通的数组对象。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值