vue-router底层用什么

Vue-router底层使用的是Vue的插件系统。Vue-router是Vue.js官方提供的路由管理器，用于构建SPA（Single Page Application单页应用）。

在Vue-router的底层实现中，主要使用了以下几个核心概念和技术：

1. 路由映射表：Vue-router使用路由映射表来管理路由信息，包括路由路径和对应的组件。通过定义这些映射关系，我们可以实现页面之间的跳转和组件的动态加载。

2. history模式与hash模式：Vue-router支持两种路由模式，分别是history模式和hash模式。在history模式下，路由信息会通过浏览器的history API来管理，这样URL中不会出现"#"(hash)符号；而在hash模式下，路由信息会通过URL的hash值来管理，URL中会有一个"#"符号。

3. 路由钩子函数：Vue-router提供了多个钩子函数，用于在路由跳转前、跳转后、以及路由变化时执行一些额外的逻辑。比如，beforeEach函数可以用来进行路由守卫，控制页面的访问权限。

4. 路由参数和动态路由：Vue-router允许定义路由参数和动态路由，在路由的路径中可以包含占位符，它们可以被动态地替换成真实的值，从而实现根据不同的参数动态加载不同的组件。

5. 路由导航和路由组件：Vue-router提供了router-link和router-view这两个组件来实现页面的导航和路由视图的渲染。其中，router-link组件用于生成具有路由功能的链接，而router-view组件用于根据当前的路由渲染对应的组件。

综上所述，Vue-router底层主要使用了Vue的插件系统，通过路由映射表、路由模式、路由钩子函数等核心概念和技术来实现路由的管理和控制。

Vue Router 底层使用的是 JavaScript 的 History API。

1. History API: Vue Router 基于浏览器的 History API 来实现路由的功能。History API 允许客户端在不刷新页面的情况下修改 URL，从而实现了前端路由的功能。通过使用 History API，Vue Router 可以实现跳转页面、返回页面、前进页面等路由操作。

2. pushState(): History API 中的 pushState() 方法用于在浏览器历史记录中添加新的状态。当调用 pushState() 方法时，可以修改当前的 URL，并将新状态添加到历史记录中。Vue Router 使用 pushState() 来完成路由的导航。

3. replaceState(): History API 中的 replaceState() 方法用于修改当前的 URL，并替换掉当前的历史记录状态。Vue Router 使用 replaceState() 来实现路由的替换操作，比如通过点击浏览器的前进/后退按钮来切换路由。

4. popstate 事件: 当用户点击浏览器的前进/后退按钮或者调用了 pushState() 或 replaceState() 方法时，浏览器会触发 popstate 事件。Vue Router 通过监听 popstate 事件来实现路由的监听和导航。

5. hash 模式: 在一些不支持 History API 的老版本浏览器中，Vue Router 支持通过 hash 模式来实现路由。在 hash 模式下，URL 中的 # 符号后面的内容被称为 hash，hash 的变化不会触发页面的刷新，可以通过监听 hashchange 事件来实现路由的导航。但是使用 hash 模式会导致URL不够友好。

vue-router作为Vue.js官方的路由管理器，是基于Vue.js的全局状态管理机制实现的。具体来说，vue-router底层使用了Vue.js提供的响应式数据绑定机制和组件化开发模式来实现路由的管理和切换。

Vue.js的响应式数据绑定机制是通过使用Observer（观察者）模式来实现的，它可以检测到数据的变化并自动更新相应的视图。在vue-router中，使用Vue.js的响应式数据绑定机制来监听路由相关的数据变化，比如当前路径、参数、查询等，从而实现路由的自动更新。

在使用vue-router时，需要定义路由表，即一组映射关系，将路径和相应的组件关联起来。这些组件可以是Vue.js的单文件组件，也可以是普通的JavaScript对象。当访问到某个路径时，vue-router会根据路由表的配置来选择加载对应的组件。

在底层实现上，vue-router通过使用Vue.js提供的组件化开发模式，将路由表中的每个组件都封装成了一个Vue.js组件。这些组件可以通过路由的切换来动态加载和销毁，从而实现页面的无刷新切换。

另外，vue-router还提供了一些导航守卫的功能，可以在路由切换前后执行一些逻辑。比如可以在路由切换前检查用户是否已登录，或者在路由切换后统计页面的PV（页面访问量）等。

总结来说，vue-router底层使用了Vue.js的响应式数据绑定机制和组件化开发模式来实现路由的管理和切换。通过这种方式，可以使路由和组件的状态保持同步，从而实现高效和可靠的路由管理。