vue项目访问路径#号的问题

Posted 流楚丶格念

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了vue项目访问路径#号的问题相关的知识,希望对你有一定的参考价值。

是vue项目启动之后,输入http://ip:port,我发现浏览器里面显示的地址栏竟然是http://ip:port/#/,这个”/#/“不知道是什么东西,于是百度查了一下。

原因:对于vue开发的单页面应用,我们在切换不同的页面的时候,可以发现html永远只有一个,这也正是称之为单页面的原因。而vue-router默认hash模式--------使用URL的hash来模拟一个完整的URL,于是当URL改变时,页面不会重新加载。因为对于正常的页面来说,更换url一定是会导致页面更换的,而只有更换url中的查询字符串和hash值的时候才不会重新加载页面。

如果不想要#,可以使用路由的history模式,这种模式充分利用了history.pushState API来完成URL的跳转而不需要重新加载页面,使用这种模式之后,就没有#了,而是可以像使用正常的url进行访问了。

但是使用history模式有一个坑,如果你改了history模式,你还没有进行404跳转配置,你再刷新页面,页面就会报404

以上是关于vue项目访问路径#号的问题的主要内容,如果未能解决你的问题,请参考以下文章

vue--前端部署项目后访问静态资源404

vue--前端部署项目后访问静态资源404

vue项目打包后css背景图路径不对的问题

vue配合nginx打包路径层问题

Vue项目打包后,只能访问首页,其他页面路径找不到

vue-route+webpack部署单页路由项目,访问刷新出现404问题