请简述vue-router 动态路由是什么？
参考回答
Vue Router 的 动态路由 允许你在运行时动态地加载或修改路由配置。通过动态路由，应用可以根据用户的需求或特定条件来改变路由配置，常用于基于权限、用户状态或某些参数动态生成路由。
动态路由有两种主要形式：
1. 动态路由匹配：通过在路由路径中使用动态参数来匹配不同的路径。
2. 路由懒加载：按需加载路由组件，提高性能，只有在路由被访问时才加载相应的组件。
详细讲解与拓展
1. 动态路由匹配
动态路由匹配允许在路由的路径中使用参数（如 :id 或 :slug）。这些参数可以在路由组件中使用，并根据实际的 URL 动态变化。
例如：
const routes = [
{
path: '/user/:id',
component: User
}
]
在这个例子中，/user/:id 路由会匹配 /user/1、/user/abc 等路径，其中 :id 是一个动态参数，可以在组件中通过 this.$route.params.id 获取。
export default {
created() {
console.log(this.$route.params.id); // 输出路由参数
}
}
当访问 /user/123 时，id 的值将是 123。
2. 路由懒加载（按需加载）
动态路由还可以与路由懒加载结合使用，这意味着组件会在路由访问时才加载，而不是在应用初始化时就加载，从而提高性能。Vue Router 支持通过 import() 语法实现路由懒加载。
例如：
const routes = [
{
path: '/about',
component: () => import('./views/About.vue') // 懒加载 About 组件
}
]
通过这种方式，当用户访问 /about 路径时，About.vue 组件才会被加载，避免了不必要的初始加载。
3. 动态添加路由
Vue Router 还支持在应用运行时动态添加新的路由。这对于基于用户权限或其他条件动态生成路由配置非常有用。
例如，假设我们需要根据用户权限来添加不同的路由：
const router = new VueRouter({
routes: [
{ path: '/', component: Home }
]
});
// 动态添加路由
router.addRoutes([
{ path: '/admin', component: Admin }
]);
// 添加路由后，访问 /admin 路径会加载 Admin 组件
通过 router.addRoutes() 方法，可以动态向现有的路由配置中添加新路由。
总结
Vue Router 的动态路由机制使得开发者可以在运行时灵活地处理路由的路径和组件加载。动态路由匹配允许使用路由参数来匹配不同的路径，路由懒加载则可以按需加载组件，提升性能。同时，Vue Router 还支持动态地向应用中添加新路由，适应复杂的需求。