一句话解决vue2数组是不是响应式

103 阅读1分钟

之前面试的时候碰到的这个问题,当时也是查了不少资料,才搞明白怎么回事,但那篇帖子写的太多,涉及到很多原理的。我面试时候喜欢直接说关键点,不喜欢说那些乱七八糟的,所以写了这篇,方便有同样问题的人查找。

直接说答案:是响应式,同时也不是响应式。

原因如下,vue2对数组的7个方法进行了重写,分别是:

  1. push():向数组末尾添加一个元素;

  2. pop():从数组末尾删除一个元素;

  3. shift():从数组头部删除一个元素;

  4. unshift():向数组头部添加一个元素;

  5. splice():在数组中添加或删除一个或多个元素;

  6. sort():对数组进行排序;

  7. reverse():对数组进行反转。

所以,在vue2中使用这些方法进行修改数组,数组是响应式的,但是如果单独修改数组的某些属性,那么数组就不是响应式了。

那么如何变成响应式呢?

vue2提供了一个api,就是$set,可以通过这个方法把单独修改数组的某一项的操作变为响应式。