I have a problem with my Vue application. it is a big application with over 40 pages. The problem is sometimes the browser caches the scroll position so when the user moves from a page to another, browser shows the scroll position of the previous page. Which hides the top page content from a user who needs to scroll up to see the full content. This is bad for the user experience.
I found a solution here but it needs to copy/paste in all the 40 pages views which is not very smart. Any better solutions
Well, using the helpful answer in the linked answer but much more smart, I found a grat method of router called afterEach here is how:
router.afterEach((to, from) => {
window.scrollTo(0, 0);
});
by this code, whenever route changes, the window will scroll back to the top left corner of the browser preventing any cached scroll position and providing a better user experience