fix large array update regression (fix vuejs#1248)

yyx990803 · yyx990803 · commit 3333598a886e · 2015-09-03T15:14:40.000-04:00
diff --git a/src/observer/array.js b/src/observer/array.js
@@ -28,7 +28,7 @@ var arrayMethods = Object.create(arrayProto)
     }
     var result = original.apply(this, args)
     var ob = this.__ob__
-    var inserted
+    var inserted, removed
     switch (method) {
       case 'push':
         inserted = args
@@ -38,11 +38,17 @@ var arrayMethods = Object.create(arrayProto)
         break
       case 'splice':
         inserted = args.slice(2)
+        removed = result
+        break
+      case 'pop':
+      case 'shift':
+        removed = [result]
         break
     }
     if (inserted) ob.observeArray(inserted)
+    if (removed) ob.unobserveArray(removed)
     // notify change
-    ob.dep.notify()
+    ob.notify()
     return result
   })
 })
diff --git a/src/observer/index.js b/src/observer/index.js
@@ -111,7 +111,42 @@ Observer.prototype.observe = function (val) {
 Observer.prototype.observeArray = function (items) {
   var i = items.length
   while (i--) {
-    this.observe(items[i])
+    var ob = this.observe(items[i])
+    if (ob) {
+      (ob.parents || (ob.parents = [])).push(this)
+    }
+  }
+}
+
+/**
+ * Remove self from the parent list of removed objects.
+ *
+ * @param {Array} items
+ */
+
+Observer.prototype.unobserveArray = function (items) {
+  var i = items.length
+  while (i--) {
+    var ob = items[i] && items[i].__ob__
+    if (ob) {
+      ob.parents.$remove(this)
+    }
+  }
+}
+
+/**
+ * Notify self dependency, and also parent Array dependency
+ * if any.
+ */
+
+Observer.prototype.notify = function () {
+  this.dep.notify()
+  var parents = this.parents
+  if (parents) {
+    var i = parents.length
+    while (i--) {
+      parents[i].notify()
+    }
   }
 }
 
@@ -136,12 +171,6 @@ Observer.prototype.convert = function (key, val) {
         if (childOb) {
           childOb.dep.depend()
         }
-        if (_.isArray(val)) {
-          for (var e, i = 0, l = val.length; i < l; i++) {
-            e = val[i]
-            e && e.__ob__ && e.__ob__.dep.depend()
-          }
-        }
       }
       return val
     },
diff --git a/src/observer/object.js b/src/observer/object.js
@@ -21,7 +21,7 @@ _.define(
       return
     }
     ob.convert(key, val)
-    ob.dep.notify()
+    ob.notify()
     if (ob.vms) {
       var i = ob.vms.length
       while (i--) {
@@ -69,7 +69,7 @@ _.define(
     if (!ob || _.isReserved(key)) {
       return
     }
-    ob.dep.notify()
+    ob.notify()
     if (ob.vms) {
       var i = ob.vms.length
       while (i--) {
diff --git a/test/unit/specs/misc_spec.js b/test/unit/specs/misc_spec.js
@@ -332,4 +332,20 @@ describe('Misc', function () {
     Vue.config.strict = false
   })
 
+  it('nested object $set should trigger parent array notify', function (done) {
+    var vm = new Vue({
+      el: document.createElement('div'),
+      template: '{{items | json}}{{items[0].a}}',
+      data: {
+        items: [{}]
+      }
+    })
+    expect(vm.$el.textContent).toBe(JSON.stringify(vm.items, null, 2))
+    vm.items[0].$set('a', 123)
+    Vue.nextTick(function () {
+      expect(vm.$el.textContent).toBe(JSON.stringify(vm.items, null, 2) + '123')
+      done()
+    })
+  })
+
 })
