fix: perperly handle v-if on <template> scoped slot

fix #6725
This commit is contained in:
Evan You 2017-10-10 12:21:42 -04:00
parent 2d32b5d1b6
commit 68bdbf508b
2 changed files with 42 additions and 3 deletions

View File

@ -343,11 +343,14 @@ function genScopedSlot (
if (el.for && !el.forProcessed) {
return genForScopedSlot(key, el, state)
}
return `{key:${key},fn:function(${String(el.slotScope)}){` +
const fn = `function(${String(el.slotScope)}){` +
`return ${el.tag === 'template'
? genChildren(el, state) || 'void 0'
? el.if
? `${el.if}?${genChildren(el, state) || 'undefined'}:undefined`
: genChildren(el, state) || 'undefined'
: genElement(el, state)
}}}`
}}`
return `{key:${key},fn:${fn}}`
}
function genForScopedSlot (

View File

@ -557,4 +557,40 @@ describe('Component scoped slot', () => {
expect(vm.$el.innerHTML).toBe('<span>world foo</span> <span>world bar</span> <span>world abc</span>')
}).then(done)
})
// #6725
it('scoped slot with v-if', done => {
const vm = new Vue({
data: {
ok: false
},
template: `
<test>
<template v-if="ok" slot-scope="foo">
<p>{{ foo.text }}</p>
</template>
</test>
`,
components: {
test: {
data () {
return { msg: 'hello' }
},
template: `
<div>
<slot :text="msg">
<span>{{ msg }} fallback</span>
</slot>
</div>
`
}
}
}).$mount()
expect(vm.$el.innerHTML).toBe('<span>hello fallback</span>')
vm.ok = true
waitForUpdate(() => {
expect(vm.$el.innerHTML).toBe('<p>hello</p>')
}).then(done)
})
})