Skip to content

Commit

Permalink
fix: keep-alive should not cache anonymous components
Browse files Browse the repository at this point in the history
This only happens if the component is returned by a intermediate
functional or abstract component, e.g. <router-view>. Fix vuejs#6938.
  • Loading branch information
yyx990803 authored and hefeng committed Jan 25, 2019
1 parent deca94d commit 17e9fc3
Show file tree
Hide file tree
Showing 2 changed files with 55 additions and 1 deletion.
2 changes: 1 addition & 1 deletion src/core/components/keep-alive.js
Original file line number Diff line number Diff line change
Expand Up @@ -87,7 +87,7 @@ export default {
if (componentOptions) {
// check pattern
const name: ?string = getComponentName(componentOptions)
if (name && (
if (!name || (
(this.exclude && matches(this.exclude, name)) ||
(this.include && !matches(this.include, name))
)) {
Expand Down
54 changes: 54 additions & 0 deletions test/unit/features/component/component-keep-alive.spec.js
Original file line number Diff line number Diff line change
Expand Up @@ -550,6 +550,60 @@ describe('Component keep-alive', () => {
expect(`Unknown custom element: <foo>`).toHaveBeenWarned()
})

// #6938
it('should not cache anonymous component', done => {
const Foo = {
name: 'foo',
template: `<div>foo</div>`,
created: jasmine.createSpy('foo')
}

const Bar = {
template: `<div>bar</div>`,
created: jasmine.createSpy('bar')
}

const Child = {
functional: true,
render (h, ctx) {
return h(ctx.props.view ? Foo : Bar)
}
}

const vm = new Vue({
template: `
<keep-alive include="foo">
<child :view="view"></child>
</keep-alive>
`,
data: {
view: true
},
components: { Child }
}).$mount()

function assert (foo, bar) {
expect(Foo.created.calls.count()).toBe(foo)
expect(Bar.created.calls.count()).toBe(bar)
}

expect(vm.$el.textContent).toBe('foo')
assert(1, 0)
vm.view = false
waitForUpdate(() => {
expect(vm.$el.textContent).toBe('bar')
assert(1, 1)
vm.view = true
}).then(() => {
expect(vm.$el.textContent).toBe('foo')
assert(1, 1)
vm.view = false
}).then(() => {
expect(vm.$el.textContent).toBe('bar')
assert(1, 2)
}).then(done)
})

if (!isIE9) {
it('with transition-mode out-in', done => {
let next
Expand Down

0 comments on commit 17e9fc3

Please sign in to comment.