vue-router 路由中的hash模式和history模式的区别

202 阅读1分钟

在vue-router中有hash模式和history模式,两者到底有什么异同点呢?

在路由文件夹下的路由导出文件中,可以设置mode的模式.如下图:

image.png

相同点:它们都实现页面的跳转功能(跳转页面)

它们的区别体现在3个方面

a. 外观

1.history模式的path路径不带#

image.png

2:外观:hash模式的path路径带#

image.png

b. 原理 :

hash模式使用onhashchange,history模式使用pushState.导致兼容性的差异.hash模式兼容性比history模式好.history是后出现的,它的底层使用的是HTML5的API,对浏览器有一定的要求.

c. 项目上线后的区别

1.history开发的项目,在打包上线后,需要后端配置支持,不然就会出现404页面.

总结:

开发中,如果没有特殊的要求一般就用hash模式.