数组后面__ob__: Observer
时间: 2023-08-26 21:09:00 浏览: 105
数组后面的__ob__: Observer 是由 Vue.js 框架添加的属性。它是用于观察数组变化的一个特殊对象。当使用 Vue.js 的双向数据绑定功能时,Vue.js 会将数组转换为可以观察的数组,并在数组后面添加一个名为__ob__的属性,该属性包含了一些用于监听和响应数组变化的方法和属性。通过__ob__.observer属性,Vue.js 可以追踪数组的变化并触发相应的更新。这样,在修改数组时,Vue.js 可以及时地进行响应,更新相关的视图。
相关问题
将[0 : {__ob__: Observer} 1 : {__ob__: Observer} 2 : {__ob__: Observer}] 处理成一个数组对象
这个数据看起来像是 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}]
```
以上两种方法都可以将响应式数组对象转换成普通的数组对象。
uniapp 中去掉获取到带有__ob__: Observer的数组内对象的 __ob__: Observer,并且能把数据渲染到页面
在 Vue.js 中,使用 Observer 对象来监听数据变化,__ob__ 属性就是 Observer 对象的一个标识。在使用 Vue.js 的时候,我们不需要手动去处理 __ob__ 属性。但是在使用 uniapp 的时候,由于 uniapp 并没有完全兼容 Vue.js,会出现带有 __ob__ 属性的数组对象不能正常渲染到页面的问题。
为了解决这个问题,我们可以使用 JSON 序列化和反序列化的方法去掉 __ob__ 属性。具体方法如下:
1. 在获取到数组对象后,使用 JSON 序列化和反序列化的方法,将数组对象转为普通的 JS 对象。
```javascript
const arr = JSON.parse(JSON.stringify(rawArr))
```
2. 将转换后的普通对象赋值给 data 中对应的数组对象。
```javascript
this.data.list = arr
```
这样就能够去掉数组对象中的 __ob__ 属性,并且能够将数据正常渲染到页面中了。
阅读全文