Home > Back-end >  Why Vue router savedPosition returns null?
Why Vue router savedPosition returns null?

Time:11-13

I'm using Quasar and it's a brand new project so I'm using all the latest versions of Vue and Vue Router and Pinia.

I have a page with a big list of items so I thought it would be nice to keep the scroll position when going back to the list. The items are all loaded from the state using a computed property, only the first time they are loaded from the server. I have added the code that should bring back the saved position of the last page but it's coming back as null every time. only the first time that you open the app, it comes back as { x: 0, y: 0 };

I have another app in which this code works fine but it's a much older project. I'm not sure what's wrong really.

Here is my code:

 export default route(function (/* { store, ssrContext } */) {
  const createHistory = process.env.SERVER
    ? createMemoryHistory
    : process.env.VUE_ROUTER_MODE === "history"
    ? createWebHistory
    : createWebHashHistory;

  const Router = createRouter({
    scrollBehavior: (to, from, savedPosition) => {
      console.log(savedPosition);
      if (savedPosition) {
        return savedPosition;
      } else {
        return { x: 0, y: 0 };
      }
    },
    routes,
    history: createHistory(process.env.VUE_ROUTER_BASE),
  });

CodePudding user response:

As mentioned in the enter image description here

  • Related