Vue Router 提供了三种路由模式:
1:Hash 模式(默认):
在 URL 中使用带有 # 符号的哈希值来管理路由。例如:http://xxxx.com/#/path。
在 Hash 模式下,当 URL 的哈希值发生变化时,浏览器不会向服务器发送请求,而是通过监听 hashchange 事件来进行路由导航。
2:History 模式:
使用 HTML5 的 History API 来管理路由。这种模式下,URL 不再需要使用哈希值,而是直接使用正常的 URL 地址。例如:http://xxxx.com/path。
在 History 模式下,当 URL 发生变化时,浏览器会向服务器发送请求,服务器需要配置相应的路由规则,以确保在刷新页面或直接访问 URL 时能正确响应路由。
3:Abstract 模式:
这种模式主要用于非浏览器环境,比如在服务器端渲染(Server-Side Rendering)时使用。
在 Abstract 模式下,Vue Router 不会对 URL 进行任何处理,而是将路由信息保存在内存中,通过编程方式进行路由导航。
可以通过创建 Vue Router 实例时的 mode 配置项来选择使用哪种路由模式。例如:
const router = new VueRouter({mode: 'history', // 使用 History 模式routes: [...]
})