Do async function keep running when route change in Vuejs?

Viewed 352

I'm new to vuejs, I'm trying to do some data downloading from inside Vue View, using function inside methods, I wonder if I leave that view(change route), is the downloading process still running? (in this case I'm downloading from firestore, some huge databases)

Any advice on how it should be done? So that the database download keep running regardless of route change?

Any help is much appreciated

Edit: To clarify, my case are like this :

  1. User open some page
  2. The page download some data in background(will take some time)
  3. User move to another page

What I'm asking are how did I make the data download process continue running, even though user move to another route?

2 Answers

If you are developing an SPA with Vue Router, the keep-alive element might help you in this issue.

Basically, according to the Vue JS Lifecycle Diagram, once a component is destroyed, all directives of the Vue instance have been unbound, all event listeners have been removed, and all child Vue instances have also been destroyed.

In my case, I finally put the function inside vuex action, and call it using this.$store.dispatch(function name). It work flawlessly. even though I keep changing route/view, the bg process(action) keep running.

notes: I don't need the downloaded data to be binded/reactive, I just need to download the data in background and save it to localforage

Related