vue-router 将mode:'hash'换成mode:'history'跳转不正常是什么原理

Question

如上面的路由配置，没有服务端，启动在本地。 在mode:'hash'的情况下路由访问会进入对应的component。 但是在mode:'history'的情况下，不管访问哪个路由都只会跳到第一个 HelloWorld组件，而不会进入对应的组件。 这是什么原因呢？

Answer 1

1、使用hash模式的时候，原理是在你的地址后加上#号，然后在#号后加上地址来跳转。实际上是vue-router这个插件在检测你的hash值是多少，然后根据你的hash值去渲染指定的component。
2、在你更换为history的时候。实际上，地址栏上应该出现真实的地址。即你要访问别的地址的时候，需要去除#号。默认在#号后的东西，是不作为新请求的（即在服务端认为，hash后的值，还是这一页）。这个，和你在学html的时候，点击锚点链接，还是在这个页面不刷新是一个道理，但当你点击了不带#的a标签，链接是会真实跳转一个道理。
3、回归正题，你要实现跳转，请在history模式下，确保url不带任何一个#号。即假设楼主的cli开启的端口是8080。
那么跳转到login应该是http://localhost:8080/login