官方说法
vue-router
默认 hash 模式 —— 使用 URL 的 hash 来模拟一个完整的 URL,于是当 URL 改变时,页面不会重新加载。
如果不想要很丑的 hash,我们可以用路由的 history 模式,这种模式充分利用 history.pushState
API 来完成 URL 跳转而无须重新加载页面。
- const router = new VueRouter({
- mode: 'history',
- routes: [...]
- })
当你使用 history 模式时,URL 就像正常的 url,例如 http://yoursite.com/user/id
,也好看!
不过这种模式要玩好,还需要后台配置支持。因为我们的应用是个单页客户端应用,如果后台没有正确的配置,当用户在浏览器直接访问 http://oursite.com/user/id
就会返回 404,这就不好看了。
后端配置
因为我的后端web服务是用的nginx,在这里只需要加上这样一段代码即可。
- location / {
- try_files $uri $uri/ /index.html;
- }
最后
重启nginx服务,测试通过,刷新再也不会出现404啦!

微信小程序
互联网开发,终身学习者,欢迎您的关注!