怎么实现vue 跳转页面返回后回到原来的位置

要实现在 Vue 页面跳转后返回到原来的位置，可以使用以下两种方法：

1. 使用浏览器的历史记录（history）管理：
- 在跳转前，使用 `window.scrollX` 和 `window.scrollY` 获取当前页面的滚动位置，并将其存储在 Vuex 状态管理或浏览器的 localStorage 中。
- 在返回页面时，监听路由变化事件，如果返回到原来的页面，就使用 `window.scrollTo` 将页面滚动到之前保存的位置。

2. 使用 Vue Router 的 `scrollBehavior` 方法：
- 在路由配置中，使用 `scrollBehavior` 方法来自定义路由切换时的滚动行为。
- 在 `scrollBehavior` 方法中，可以通过 `savedPosition` 参数来获取之前滚动的位置，将其作为返回时的滚动位置。

下面是示例代码：

// 方法一：使用浏览器的历史记录
// 在跳转前保存滚动位置
window.beforeunload = function() {
  localStorage.setItem('scrollPosition', JSON.stringify({ x: window.scrollX, y: window.scrollY }));
};

// 在返回页面时恢复滚动位置
window.onload = function() {
  const scrollPosition = JSON.parse(localStorage.getItem('scrollPosition'));
  if (scrollPosition) {
    window.scrollTo(scrollPosition.x, scrollPosition.y);
    localStorage.removeItem('scrollPosition');
  }
};

// 方法二：使用 Vue Router 的 scrollBehavior 方法
const router = new VueRouter({
  mode: 'history',
  routes: [...],
  scrollBehavior(to, from, savedPosition) {
    if (savedPosition) {
      return savedPosition;
    } else {
      return { x: 0, y: 0 };
    }
  }
});

使用以上方法，无论是通过浏览器的历史记录还是通过 Vue Router 的 `scrollBehavior` 方法，都可以实现页面跳转后返回到原来的位置。