浏览代码

fix: fix v-for component with undefined value

fix #9181
Evan You 7 年之前
父节点
当前提交
47487607fb
共有 2 个文件被更改,包括 26 次插入0 次删除
  1. 3 0
      src/core/vdom/helpers/normalize-children.js
  2. 23 0
      test/unit/features/directives/for.spec.js

+ 3 - 0
src/core/vdom/helpers/normalize-children.js

@@ -16,6 +16,9 @@ import { isFalse, isTrue, isDef, isUndef, isPrimitive } from 'shared/util'
 // thing with Array.prototype.concat. It is guaranteed to be only 1-level deep
 // because functional components already normalize their own children.
 export function simpleNormalizeChildren (children: any) {
+  if (!Array.isArray(children)) {
+    return
+  }
   for (let i = 0; i < children.length; i++) {
     if (Array.isArray(children[i])) {
       return Array.prototype.concat.apply([], children)

+ 23 - 0
test/unit/features/directives/for.spec.js

@@ -484,6 +484,29 @@ describe('Directive v-for', () => {
     expect(vm.$el.textContent).toBe('12')
   })
 
+  // #9181
+  it('components with v-for and empty list', done => {
+    const vm = new Vue({
+      template:
+        '<div attr>' +
+          '<foo v-for="item in list">{{ item }}</foo>' +
+        '</div>',
+      data: {
+        list: undefined
+      },
+      components: {
+        foo: {
+          template: '<div><slot></slot></div>'
+        },
+      }
+    }).$mount()
+    expect(vm.$el.innerHTML).toBe('')
+    vm.list = [1, 2, 3]
+    waitForUpdate(() => {
+      expect(vm.$el.innerHTML).toBe('<div>1</div><div>2</div><div>3</div>')
+    }).then(done)
+  })
+
   const supportsDestructuring = (() => {
     try {
       new Function('var { foo } = bar')