vue实现登录后页面跳转到之前页面

要实现登录后页面跳转到之前页面，可以根据以下步骤进行操作：

1. 创建Vue Router实例

首先，需要安装并引入Vue Router，然后创建一个Vue Router实例，用于管理路由。在Vue Router实例中定义路由，包括路由名称、路径和对应组件。

示例：

// main.js
import Vue from 'vue'
import VueRouter from 'vue-router'
import Login from './Login.vue'
import HomePage from './HomePage.vue'

Vue.use(VueRouter)

const routes = [
  { path: '/', component: Login },
  { path: '/home', component: HomePage }
]

const router = new VueRouter({
  routes
})

2. 在登录页面中记录之前的路由信息

登录页面需要在登录按钮点击事件中记录当前路由信息，这里使用localStorage来存储路由信息。登录成功后，会自动跳转到之前的页面。

示例：

// Login.vue

export default {
  methods: {
    handleLogin() {
      // 登录成功后存储当前路由信息
      window.localStorage.setItem('beforeLoginUrl', this.$route.fullPath)

      // 登录成功后跳转到之前的页面
      this.$router.push('/home')
    }
  }
}

3. 在路由导航守卫中根据存储的路由信息跳转到之前的页面

在Vue Router中有一个路由导航守卫beforeEach，可以在页面切换前对路由进行判断和处理，这里通过在导航守卫中判断是否存在之前的路由信息，如果存在则跳转到之前的页面。

示例：

// main.js

router.beforeEach((to, from, next) => {
  // 判断是否存在之前的路由信息
  let beforeLoginUrl = window.localStorage.getItem('beforeLoginUrl')
  if (beforeLoginUrl && beforeLoginUrl !== '/') {
    // 存在之前的路由信息，移除之前的路由信息并跳转到之前的页面
    window.localStorage.removeItem('beforeLoginUrl')
    next(beforeLoginUrl)
  } else {
    next()
  }
})

完整的实现思路就是如此，可以根据实际需求进行调整。