VUE3 炉头redirect 怎么用

在 Vue3 中，`redirect` 是 Vue Router 提供的一个功能，用于控制用户首次访问路由时的行为。当你在路由配置中设置了 `redirect`，那么当你尝试访问该路由的时候，实际上会被重定向到指定的新路径。

下面是一个简单的例子，展示如何在 `.js` 文件中使用 `redirect`：

import { createRouter, createWebHistory } from 'vue-router';

const routes = [
  {
    path: '/old-url', // 将重定向到新的路径
    redirect: { name: '新路由名称' }, // 使用路由名称重定向
    meta: {
      requireAuth: true, // 可选属性，标记需要登录才能访问
    },
  },
  {
    path: '/new-url', // 新的路由地址
    component: NewComponent,
    name: '新路由名称', // 显示在侧边栏或菜单上
  },
];

const router = createRouter({
  history: createWebHistory(),
  routes,
});

export default router;

在这个例子中，如果用户尝试访问 `/old-url`，他们会被重定向到名为 `新路由名称` 的路由，例如可能是 `/new-url`。

注意：`redirect` 属性只会在路由第一次被激活时生效，之后再次访问该路由将不会自动重定向。如果你想实现在任何时候都重定向，可以在路由组件的生命周期钩子里手动调用 `this.$router.push`。