type
status
date
slug
summary
tags
category
icon
password
Hash和History模式区别
- 表现形式的区别
Hash模式的url中带有#号(https://baidu.com/#/play?id=20220530)
History模式(https://baidu.com/play/20220530)
- 原理的区别
Hash模式是基于锚点，以及onhashchange事件
History模式是基于HTML5中的History API(
history.pushState
history.replaceState
)
VueRouter实现原理
Hash模式
- URL中#后面的内容作为路径地址
- 监听hashchange事件
- 根据当前路径地址找到对应组件重新渲染
History模式
- 通过history.pushState()方法改变地址栏
- 监听popstate事件
- 根据当前路径地址找到对应组件重新渲染
- 作者:Leeson
- 链接: /article/vue-router
- 声明:本文采用 CC BY-NC-SA 4.0 许可协议，转载请注明出处。