[V3 Vue] Prevent destroy of component on back click

Questions
1

Now I see that F7 destroys page component on going backwards in router.
Is it possible to keep that component created (something like keep-alive in vue-router)?
Because I have some heavy actions in “created()” component hook and don’t need to make the same work each time user navigates this page.
Thanks

2

Hey!

Check it, “stack-pages”

3

stack-pages are working, but only when moving forward (or “deeper” in master-detail relationship).
If I press back button or call router.back(), then the current page gets destroyed.

4

for the vue side you can try with keep alive

5

Unfortunately this is not supported. But you can cache your actions that you do in created hook? For example if you do some heave XHR requests, then it can be cached like:

<template>
  ...
</template>
<script>
  var xhrResult;
  export default {
    data() {
      return {
        xhrResult: xhrResult,
      };
    },
    created() {
      if (!this.xhrResult) {
        // do some XHR request and then
        this.xhrResult = something;
        // cache
        xhrResult = something;
      }
    },
  }
</script>
6

Any chance to see this feature in future versions?
In my case I have a map on a page and creating map, loading tiles, centering it on specified position every time - all of this slows down an app and causes flickering and not very user-friendly.

1 Like
7

Yes, added some kind of such functionality, will be available in next update