Component lifecycle and async calls

user switches between routes/components which have async calls.
callbacks and everything component has after callback still executed even if user already has changed route(switched component). Is it ok? what should i do? is it vue bug? or js behaviour?

It’s expected behaviour, since Javascript doesn’t come with a way to actually cancel promises.

The simplest way to deal with this is to check the current route after the async call has finished and check that the current route is still a match for the component that sent the request. if it’s not, abort.


// imagine we are on route { name: 'profile' }
created() {
  someAsyncOp()
  .then(result => {
    if (this.$route.name !== 'profile') return

    // do stuff
  })
}

so, there is no way to terminate everything inside component on component destroy?

No. Javascript promises cannot be aborted. That’s technically not possible with native Promises.

You can build something that cancel-able with something like RxJS, but that’s a whole new skillset to learn.