diff --git a/src/compiler/codegen/index.js b/src/compiler/codegen/index.js index c96b3a38511..0acbcca3a60 100644 --- a/src/compiler/codegen/index.js +++ b/src/compiler/codegen/index.js @@ -546,7 +546,7 @@ export function genComment (comment: ASTText): string { function genSlot (el: ASTElement, state: CodegenState): string { const slotName = el.slotName || '"default"' const children = genChildren(el, state) - let res = `_t(${slotName}${children ? `,${children}` : ''}` + let res = `_t(${slotName}${children ? `,function(){return ${children}}` : ''}` const attrs = el.attrs || el.dynamicAttrs ? genProps((el.attrs || []).concat(el.dynamicAttrs || []).map(attr => ({ // slot props are camelized diff --git a/src/core/instance/render-helpers/render-slot.js b/src/core/instance/render-helpers/render-slot.js index 52221f4bbc8..154db82cf1c 100644 --- a/src/core/instance/render-helpers/render-slot.js +++ b/src/core/instance/render-helpers/render-slot.js @@ -7,7 +7,7 @@ import { extend, warn, isObject } from 'core/util/index' */ export function renderSlot ( name: string, - fallback: ?Array, + fallbackRender: ?() => Array, props: ?Object, bindObject: ?Object ): ?Array { @@ -24,9 +24,9 @@ export function renderSlot ( } props = extend(extend({}, bindObject), props) } - nodes = scopedSlotFn(props) || fallback + nodes = scopedSlotFn(props) || (fallbackRender && fallbackRender()) } else { - nodes = this.$slots[name] || fallback + nodes = this.$slots[name] || (fallbackRender && fallbackRender()) } const target = props && props.slot diff --git a/test/unit/features/component/component-slot.spec.js b/test/unit/features/component/component-slot.spec.js index 3e5fa883978..f7b2befa5ac 100644 --- a/test/unit/features/component/component-slot.spec.js +++ b/test/unit/features/component/component-slot.spec.js @@ -109,6 +109,26 @@ describe('Component slot', () => { expect(child.$el.children[1].textContent).toBe('slot b') }) + it('fallback content should not be evaluated when the parent is providing it', () => { + const test = jasmine.createSpy('test') + const vm = new Vue({ + template: 'slot default', + components: { + test: { + template: '
{{test()}}
', + methods: { + test () { + test() + return 'test' + } + } + } + } + }).$mount() + expect(vm.$el.textContent).toBe('slot default') + expect(test).not.toHaveBeenCalled() + }) + it('selector matching multiple elements', () => { mount({ childTemplate: '
', diff --git a/test/unit/modules/compiler/codegen.spec.js b/test/unit/modules/compiler/codegen.spec.js index 10c65618a58..29e87fa8c49 100644 --- a/test/unit/modules/compiler/codegen.spec.js +++ b/test/unit/modules/compiler/codegen.spec.js @@ -196,7 +196,7 @@ describe('codegen', () => { it('generate slot fallback content', () => { assertCodegen( '
hi
', - `with(this){return _c('div',[_t("default",[_c('div',[_v("hi")])])],2)}` + `with(this){return _c('div',[_t("default",function(){return [_c('div',[_v("hi")])]})],2)}` ) })