Просмотр исходного кода

fix slot fallback content scope inside v-for (fix #1282)

Evan You 10 лет назад
Родитель
Сommit
59b364a266
2 измененных файлов с 28 добавлено и 4 удалено
  1. 4 1
      src/directives/element/slot.js
  2. 24 3
      test/unit/specs/directives/element/slot_spec.js

+ 4 - 1
src/directives/element/slot.js

@@ -62,8 +62,11 @@ module.exports = {
 
   compile: function (content, context, host) {
     if (content && context) {
+      var scope = host
+        ? host._scope
+        : this._scope
       this.unlink = context.$compile(
-        content, host, this.vm._scope, this._frag
+        content, host, scope, this._frag
       )
     }
     if (content) {

+ 24 - 3
test/unit/specs/directives/element/slot_spec.js

@@ -7,7 +7,10 @@ describe('Slot Distribution', function () {
   beforeEach(function () {
     el = document.createElement('div')
     options = {
-      el: el
+      el: el,
+      data: {
+        msg: 'self'
+      }
     }
   })
 
@@ -39,10 +42,10 @@ describe('Slot Distribution', function () {
   })
 
   it('fallback content', function () {
-    options.template = '<slot><p>fallback</p></slot>'
+    options.template = '<slot><p>{{msg}}</p></slot>'
     mount()
     expect(el.firstChild.tagName).toBe('P')
-    expect(el.firstChild.textContent).toBe('fallback')
+    expect(el.firstChild.textContent).toBe('self')
   })
 
   it('fallback content with multiple named slots', function () {
@@ -364,4 +367,22 @@ describe('Slot Distribution', function () {
     expect(el.textContent).toBe('123234')
   })
 
+  it('fallback inside v-for', function () {
+    new Vue({
+      el: el,
+      template: '<div v-for="n in 3"><comp></comp></div>',
+      components: {
+        comp: {
+          template: '<div><slot>{{something}}</slot></div>',
+          data: function () {
+            return {
+              something: 'hi'
+            }
+          }
+        }
+      }
+    })
+    expect(el.textContent).toBe('hihihi')
+  })
+
 })