关于Vue "__ob__:Observer"属性的解决方案详析
更新时间：2022年11月12日 15:11:39 作者：一个水瓶座程序猿.
在操作数据的时候发现,__ob__: Observer这个属性出现之后,如果单独拿数据的值,就会返回undefined,下面这篇文章主要给大家介绍了关于Vue "__ob__:Observer"属性的解决方案,需要的朋友可以参考下
问题描述
- 我们操作 Vue 数据的时候，经常会看到这个属性:
__ob__:Observer - 在我们操作这个数据的时候，如果想要单独拿这个数据里面的值，就会返回
undefined - 经过我在网上查找相关资料，发现
__ob__:Observer是 Vue 中一个非常重要的知识点
原因分析：
那么什么是数据对象的
__ob__属性呢？
其实 __ob__:Observer 这些数据，是 Vue 框架对数据设置的监控器，一般是 不可以被枚举 的
解决方案：
下面是我在网上查资料找的几点解决方案，希望可以帮到大家：
第一种： __ob__: Observer 是 Vue 对数据监控添加的属性，如果想去掉可以采用对象赋值的方式。
举个例子：Object.assign({ },this.owner)
扩展知识：Object.assign() 方法将所有可枚举和自有属性从一个或多个源对象复制到目标对象，返回修改后的对象。
第二种： 比如说 list 里面存放的就是那些带有 __ob__:Observer 的数据，那么可以使用 JSON.parse(JSON.stringify(this.list)) 来进行解决
第三种： 直接操作数据
// 将后端返回的数据，赋值给我们定义的变量 // 举个例子：我们定义的变量叫做 tableData this.tableData = res.data; // 我们把后端返回的数据，赋值给我们的变量 this.tableData 如果我们是在控制台输出: console.log(this.tableData.id) // 就会返回 undefined 但是如果我们加上索引: console.log(this.tableData[0].id) // 就会得到我们想要的 id 了
总结
到此这篇关于关于Vue "__ob__:Observer"属性的解决方案的文章就介绍到这了,更多相关Vue "__ob__:Observer"属性解决内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！
相关文章
这篇文章主要介绍了解决vue页面渲染但dom没渲染的操作，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2020-07-07
这篇文章主要介绍了uni-app 的自定义组件，本文通过实例代码给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下2021-10-10
这篇文章主要介绍了mpvue全局引入sass文件的方法步骤，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2019-03-03
这篇文章主要介绍了Vue中SourceMap的使用方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教2024-06-06
今天小编就为大家分享一篇Vue v-for循环之@click点击事件获取元素示例，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2019-11-11
这篇文章主要介绍了Vue基于iview实现登录密码的显示与隐藏功能,本文通过截图实例代码说明给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下2020-03-03
这篇文章主要介绍了Vue3内置组件Teleport使用方法，Teleport是Vue 3.0 新增的一个内置组件，主要是为了解决一些特殊场景下模态对话框组件、组件的渲染，带着些许的了解一起走进下面文章的详细内容吧2021-10-10
今天小编就为大家分享一篇vue点击input弹出带搜索键盘并监听该元素的方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2018-08-08
element ui el-date-picker组件默认值方式
这篇文章主要介绍了element ui el-date-picker组件默认值方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教2023-12-12
本文给大家分析下vue2.0几个重要的与自己目前项目相关的变化，也是vue2.0不可忽视的变化，非常不错，具有参考借鉴价值，感兴趣的朋友一起看看吧2016-09-09
最新评论