vue 路由hash和history的区别

hash

url中#符号本身及其后面的都是hash，http请求并不包括hash部分。
vue源码中是通过window.location.hash改变路由，会在浏览器的访问历史中增加一个记录。
监听hash：
window.addEventListener(“hashchange”, fun, false);

$router.push():window.location.hash = path;

$router.replace():window.location.replace = path;

push()方法是将新路由添加到浏览器访问历史的栈顶，replace()方法是替换当前的路由。

history

HTML5中的history interface 新增了两个方法：pushState()和replaceState().

vue history模式是通过window.history来改变路由。
push()：window.history.pushState()
replace()：window.history.replaceState()

监听history：
window.addEventListener(“popstate” , fun);

vue的hash和history的区别就是，一个是通过window.location，另一个是window.history来改变浏览器的历史记录栈。

结言

如果vue项目想要不依赖后端配置，只能用hash模式。

如果用history模式，需要后端做相应的路由配置，不然会报404。