vue中的问题思考

1.为什么 data 要写成函数,而不允许写成对象?

思考:data是 Vue 实例上的一个属性。2. 对象是对于内存地址的引用。3. 函数有自己的作用域空间。

第一点无可厚非,data属性附着于 Vue 实例上。

第二点,JS 的数据类型分为基本类型和引用类型,基本类型存储在栈内存中,引用类型存储在堆内存中,并且引用类型指向的是栈内存中的堆区地址。

小结:

Vue 里面data属性之所以不能写成对象的格式,是因为对象是对地址的引用,而不是独立存在的。如果一个.vue 文件有多个子组件共同接收一个变量的话,改变其中一个子组件内此变量的值,会影响其他组件的这个变量的值。如果写成函数的话,那么他们有一个作用域的概念在里面,相互隔阂,不受影响。

 

2.Vue实例中数组改变 `length` 或下标直接赋值什么不能更新视图?

因为vue实现双向数据绑定的机制是数据劫持,也就是在所有对象上有个Object.defineProperty()方法,通过监听set,get方法去实现,而数组没有这两个方法,所以就不会更新view;

我们直接给数组元素赋值,又或者直接赋值改变数组的长度,vue是无法检查到的,从而导致视图页面无法渲染更新。

Vue 劫持了数组可以改变原数组的 Api,使得每次调用都会执行 dep.notify() 方法进而去更新视图。

var methodsToPatch = [
  'push',
  'pop',
  'shift',
  'unshift',
  'splice',
  'sort',
  'reverse'
];

 

posted @ 2019-06-25 11:25  亦心晗  阅读(214)  评论(0编辑  收藏  举报