路由元信息

在实际开发中，我们经常需要为路由添加一些额外的信息，例如权限、标题等。Vue Router 提供了路由元信息的功能，允许我们在路由配置中添加自定义的元信息。

定义路由元信息

在路由配置中，我们可以通过 meta 属性来定义路由元信息。例如，我们可以为每个路由添加一个 requiresAuth 元信息，表示该路由是否需要登录才能访问。

const routes = [
  {
    path: '/',
    name: 'Home',
    component: Home,
    meta: {
      requiresAuth: false
    }
  },
  {
    path: '/index',
    name: 'Index',
    component: Index,
    meta: {
      requiresAuth: true
    }
  }
];

 在上面的代码中，我们为 / 和 /index路由分别定义了 requiresAuth 元信息。

使用路由元信息

在路由守卫中，我们可以通过 to.meta 来访问路由元信息。例如，我们可以在全局守卫中检查路由是否需要登录。

router.beforeEach((to, from, next) => {
  if (to.meta.requiresAuth && !isAuthenticated()) {
    next('/login');
  } else {
    next();
  }
});

在上面的代码中，我们检查 to.meta.requiresAuth 是否为 true，并且用户是否已经登录。如果路由需要登录但用户未登录，则重定向到 /login 路由。