vue3 router 重定向

Vue3 Router中可以使用`redirect`属性来进行重定向。在路由配置中，我们可以将`redirect`属性设置为一个路径，这样当用户访问当前路径时，就会自动重定向到指定的路径。下面是一个简单的例子：

const routes = [
  {
    path: '/home',
    name: 'Home',
    component: Home
  },
  {
    path: '/about',
    name: 'About',
    component: About
  },
  {
    path: '/user/:id',
    name: 'User',
    component: User
  },
  {
    path: '/redirect',
    redirect: '/home' // 重定向到 /home 路径
  }
]

在上面的例子中，我们定义了一个名为`redirect`的路由，它的`redirect`属性被设置为`/home`，这意味着当用户访问`/redirect`路径时，会自动重定向到`/home`路径。

除了直接设置路径之外，我们还可以使用一个函数来动态地计算重定向的路径。下面是一个使用函数的例子：

const routes = [
  {
    path: '/home',
    name: 'Home',
    component: Home
  },
  {
    path: '/about',
    name: 'About',
    component: About
  },
  {
    path: '/user/:id',
    name: 'User',
    component: User
  },
  {
    path: '/redirect/:id',
    redirect: to => {
      // 动态计算重定向路径
      const { id } = to.params
      return `/user/${id}`
    }
  }
]

在上面的例子中，我们定义了一个名为`redirect`的路由，它的`redirect`属性被设置为一个函数。这个函数接收一个`to`对象作为参数，这个对象包含了当前路由的信息。我们可以从`to.params`中获取到路由参数，然后根据这些参数动态地计算重定向的路径。