Skip to content

Commit

Permalink
fix(lifecycle): beforeUpdated should not be called if component is de…
Browse files Browse the repository at this point in the history
…stroyed (vuejs#9171)

fix vuejs#8076
  • Loading branch information
therealpecus authored and aJean committed Aug 19, 2020
1 parent 7a69217 commit 697bf1c
Show file tree
Hide file tree
Showing 2 changed files with 38 additions and 1 deletion.
2 changes: 1 addition & 1 deletion src/core/instance/lifecycle.js
Original file line number Diff line number Diff line change
Expand Up @@ -196,7 +196,7 @@ export function mountComponent (
// component's mounted hook), which relies on vm._watcher being already defined
new Watcher(vm, updateComponent, noop, {
before () {
if (vm._isMounted) {
if (vm._isMounted && !vm._isDestroyed) {
callHook(vm, 'beforeUpdate')
}
}
Expand Down
37 changes: 37 additions & 0 deletions test/unit/features/options/lifecycle.spec.js
Original file line number Diff line number Diff line change
Expand Up @@ -152,6 +152,43 @@ describe('Options lifecycle hooks', () => {
expect(vm.$el.textContent).toBe('bar!')
}).then(done)
})

// #8076
it('should not be called after destroy', done => {
const beforeUpdate = jasmine.createSpy('beforeUpdate')
const destroyed = jasmine.createSpy('destroyed')

Vue.component('todo', {
template: '<div>{{todo.done}}</div>',
props: ['todo'],
destroyed,
beforeUpdate
})

const vm = new Vue({
template: `
<div>
<todo v-for="t in pendingTodos" :todo="t" :key="t.id"></todo>
</div>
`,
data () {
return {
todos: [{ id: 1, done: false }]
}
},
computed: {
pendingTodos () {
return this.todos.filter(t => !t.done)
}
}
}).$mount()

vm.todos[0].done = true
waitForUpdate(() => {
expect(destroyed).toHaveBeenCalled()
expect(beforeUpdate).not.toHaveBeenCalled()
}).then(done)
})
})

describe('updated', () => {
Expand Down

0 comments on commit 697bf1c

Please sign in to comment.