目录
- 一、简介
一、简介
~~~~~~~~ 在Vue.js中,路由模式是用来管理应用程序中不同页面之间的导航的机制。Vue Router支持两种常见的路由模式:history模式和hash模式。
-
History 模式:
~~~~~~~~ History模式使用浏览器的history.pushState API 来管理路由。它通过修改浏览器的URL来实现导航,而不会产生像hash模式那样的"#"符号。①使用History模式的优点:
- 更加美观的URL:URL不包含"#"符号,看起来更加清晰、美观。
- 更自然的导航:URL看起来像传统的URL,更符合用户习惯。
②使用History模式的缺点:
- 需要服务器支持:因为使用history模式时,浏览器的URL会发生变化,所以需要服务器配置以确保在直接访问URL时能够正确响应。
启用History模式,你需要在Vue Router的初始化中设置mode为history:
const router = new VueRouter({mode: 'history',routes: [// 路由配置] });
-
Hash 模式
~~~~~~ Hash模式使用浏览器的URL中的"#“符号来实现导航。当URL中的hash改变时,不会触发页面刷新,而会通过监听hashchange事件来更新视图。
①使用Hash模式的优点:
~~~~~~~~ 兼容性好:不需要服务器特殊配置,兼容性更好。
~~~~~~~~ 简单易用:不需要额外的服务器配置,即可开始使用。
②使用Hash模式的缺点:
~~~~~~~~ URL中包含”#"符号:URL看起来不太美观,可能不如history模式那样友好。
启用Hash模式,是Vue Router的默认模式,你不需要特别设置,除非你想使用history模式。
总之,Vue Router的history模式和hash模式在URL展示和浏览器支持方面有所不同,你可以根据项目需求选择适合的路由模式。