一、路由和路由器
- 路由（Route）：路由是指应用的某个路径或状态，如URL和页面标题。
- 路由器（Router）：路由器是管理所有路由的一个对象。在Vue.js中，我们通过Vue Router来创建和管理路由。
动态路由匹配
- 路径参数：可以在路径中使用“参数”（例如：
/user/:id），当匹配到一个路由时，参数值将被设置到this.$route.params中。
嵌套路由
- 嵌套视图：Vue Router允许配置嵌套路由，这为渲染嵌套视图提供了便利。
编程式的导航
- 导航方法：除了使用
<router-link>创建a标签来定义导航链接，还可以使用router.push来实现编程式导航。
路由模式
- hash模式：使用URL的hash来模拟一个完整的URL，当URL改变时，页面不会重新加载。
- history模式：依赖HTML5 History API和服务器配置。使用history模式时，URL看起来更“美观”，但需要服务器端支持。
路由参数
- 动态路由：使用
:param标记动态部分。例如：/user/:id，其中:id是一个动态参数。 - 查询参数：处理URL中的查询参数，如
/user?name=John。
命名路由
- 便利性：可以给路由指定一个名字，之后可通过名字来引用路由，而不是写URL或路径。
命名视图
- 多视图管理：允许在同一页面上拥有多个
<router-view>，每个<router-view>可以显示不同的组件。
路由守卫
路由守卫是执行导航控制的函数，可以在路由被确认之前或解析之后执行一些逻辑。
全局守卫
- beforeEach：在路由进入之前全局调用。
- afterEach：在路由确认后全局调用。
路由独享的守卫
- beforeEnter：在路由配置上直接定义的守卫。
组件内的守卫
- beforeRouteEnter：在渲染该组件的对应路由被确认前调用。
- beforeRouteUpdate（2.2版本及以上）：在当前路由改变，但是该组件被复用时调用。
- beforeRouteLeave：导航离开该组件的对应路由时调用。
const router = new VueRouter({
routes: [
{ path: '/users', component: Users },
{ path: '/users/:id', component: UserDetail }
]
});在这个例子中，/users路由将渲染Users组件，而/users/:id路由将渲染UserDetail组件，并且:id是一个动态参数。
二、面试常见问题及解答
问题1：Vue Router中的mode有哪些类型，它们有什么区别？
解答：Vue Router有两种模式：hash和history。hash模式使用URL的hash部分来模拟完整URL，而history模式则依赖HTML5 History API和服务器配置。
问题2：如何在Vue Router中实现路由守卫？
解答：路由守卫可以通过beforeEach、beforeEnter和组件内的beforeRouteEnter等钩子实现，用于在路由进入前进行检查或异步操作。
问题3：Vue Router中的base选项是用来做什么的？
解答：base选项允许你指定应用的基路径。这在你的Vue应用部署在非根路径时非常有用。