0👍
✅
As you hinted, using a timeout is not a good practice since you don’t know how long it will take for the page to be destroyed, and thus you don’t know which event will be executed first by the javascript event loop.
A good practice would be to dynamically register a ‘destroyed’ hook to your page, like so:
methods: {
deletePage() {
this.$once('hook:destroyed', serverCall)
redirect()
},
},
Note: you can also use the ‘beforeDestroy’ hook and it should work equally fine.
0👍
This is the sequence of events occurring:
serverCall()
dispatches an update, modifying$store.state.pages
.content
(which depends on$store.state.pages
) recomputes, but$route.params.id
is equal to the ID of the page just deleted, soArray.prototype.find()
returnsundefined
.subcontent
(which depends oncontent
) recomputes, and dereferences theundefined
.
One solution is to check for the undefined
before dereferencing:
export default {
computed: {
content() {...},
subcontent() {
return this.content?.subcontent
👆
// OR
return this.content && this.content.subcontent
}
}
}
Source:stackexchange.com