vue 路由hash和history的区别

文章目录

    • 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。

你可能感兴趣的:(vue,vue,hash,js)