Ignore some unnecessary updates + Remove previous items later

This fix issues in complex cases with items changing height multiple times or containing horrible things like iframes

Author: Guillaume Chau

src/components/VirtualScroller.vue

@@ -286,19 +286,37 @@ export default {
           containerHeight = l * itemHeight
         }
 
-        this.keysEnabled = !(startIndex > this._endIndex || endIndex < this._startIndex)
-        this._startIndex = startIndex
-        this._endIndex = endIndex
-        this._length = l
-        this.visibleItems = items.slice(startIndex, endIndex)
-        this.itemContainerStyle = {
-          height: containerHeight + 'px',
-        }
-        this.itemsStyle = {
-          marginTop: offsetTop + 'px',
-        }
+        if (
+          this._startIndex !== startIndex ||
+          this._endIndex !== endIndex ||
+          this._offsetTop !== offsetTop ||
+          this._height !== containerHeight ||
+          this._length !== l
+        ) {
+          this.keysEnabled = !(startIndex > this._endIndex || endIndex < this._startIndex)
+
+          // Add next items
+          this.visibleItems = items.slice(this._startIndex, endIndex)
+          this.itemContainerStyle = {
+            height: containerHeight + 'px',
+          }
+          this.itemsStyle = {
+            marginTop: offsetTop + 'px',
+          }
 
-        this.emitUpdate && this.$emit('update', startIndex, endIndex)
+          // Remove previous items
+          this.$nextTick(() => {
+            this.visibleItems = items.slice(startIndex, endIndex)
+          })
+
+          this.emitUpdate && this.$emit('update', startIndex, endIndex)
+
+          this._startIndex = startIndex
+          this._endIndex = endIndex
+          this._length = l
+          this._offsetTop = offsetTop
+          this._height = containerHeight
+        }
       }
     },