Vue的数组检测问题

letMeAlone_ 2017-08-28 07:49:57

Vue单独提供了一个set来处理数组数据无法通过索引直接更新的情况。
查了挺多资料，知道了VUE是通过Object.defineProperty来监听数据的变化的。

在构造函数的时候，VUE不是把数据都遍历了一遍然后都通过Object.defineProperty绑定了set和get方法吗？

那为何数组不行？Object.defineProperty(obj,propertyName,{...}) 数组不是能通过索引来做属性名吗？

我自己试了一下



var arr=[1,2,3];



Object.defineProperty(arr,'0',{

	set:function(newValue)

	{

		console.log('change');

		this.value=newValue

		

	},

	get:function()

	{

		return this.value

		

	}

	

})

//arr[0]=1

//输出change

能否通过遍历的形式对所有数据都做以上的操作？

...全文

333 6 打赏收藏转发到动态举报

写回复

用AI写文章

6 条回复

切换为时间正序

请发表友善的回复…

发表回复

秋风_irwin 2017-10-04

打赏
举报

vue是自己写了一个对数组的检测，因为Object.defineProperty如果绑定数组的话，他无法监听到这个数组内部的变化，他只会对你绑定上去的时候，当时的那个状态的进行绑定。

letMeAlone_ 2017-08-29

打赏
举报

引用 4 楼 zhoufeng0401 的回复:

[quote=引用楼主 a250758092 的回复:] Vue单独提供了一个set来处理数组数据无法通过索引直接更新的情况。查了挺多资料，知道了VUE是通过Object.defineProperty来监听数据的变化的。在构造函数的时候，VUE不是把数据都遍历了一遍然后都通过Object.defineProperty绑定了set和get方法吗？那为何数组不行？Object.defineProperty(obj,propertyName,{...}) 数组不是能通过索引来做属性名吗？我自己试了一下
var arr=[1,2,3];

Object.defineProperty(arr,'0',{
	set:function(newValue)
	{
		console.log('change');
		this.value=newValue
		
	},
	get:function()
	{
		return this.value
		
	}
	
})
//arr[0]=1
//输出change 
能否通过遍历的形式对所有数据都做以上的操作？

如果确定能取到，此方法可行，但是相对对象的属性和数组的索引，你觉得哪个更能知道是谁吗，特别是动态数组[/quote] 我再看了下之前官方的一些解释，Vue无法通过索引的方式监听数组的增加或减少，然后测试了下defineProperty这个函数，确实如果数组长度更改后，直接通过索引的方式赋值，新增的那些长度都无法监听到变化，也就是不执行set，所以VUE应该是直接放弃了对索引这种属性的初始化，但是数组里面的JSON一样可以绑定，所以是做了一个深度遍历，给具有明确的key的属性全部重置访问器属性

persuit666 2017-08-28

打赏
举报

引用楼主 a250758092 的回复:

Vue单独提供了一个set来处理数组数据无法通过索引直接更新的情况。查了挺多资料，知道了VUE是通过Object.defineProperty来监听数据的变化的。在构造函数的时候，VUE不是把数据都遍历了一遍然后都通过Object.defineProperty绑定了set和get方法吗？那为何数组不行？Object.defineProperty(obj,propertyName,{...}) 数组不是能通过索引来做属性名吗？我自己试了一下
var arr=[1,2,3];

Object.defineProperty(arr,'0',{
	set:function(newValue)
	{
		console.log('change');
		this.value=newValue
		
	},
	get:function()
	{
		return this.value
		
	}
	
})
//arr[0]=1
//输出change 
能否通过遍历的形式对所有数据都做以上的操作？

如果确定能取到，此方法可行，但是相对对象的属性和数组的索引，你觉得哪个更能知道是谁吗，特别是动态数组