首先
browserHistory
其实使用的是 HTML5 的
History API
,浏览器提供相应的接口来修改浏览器的历史记录;而
hashHistory
是通过改变地址后面的 hash 来改变浏览器的历史记录;
History API 提供了 pushState() 和 replaceState() 方法来增加或替换历史记录。而 hash 没有相应的方法,所以并没有替换历史记录的功能。但 react-router 通过 polyfill 实现了此功能,具体实现没有看,好像是使用 sessionStorage。
另一个原因是 hash 部分并不会被浏览器发送到服务端,也就是说不管是请求
http://domain.com/index.html#foo
还是
http://domain.com/index.html#bar
,服务只知道请求了 index.html 并不知道 hash 部分的细节。而 History API 需要服务端支持,这样服务端能获取请求细节。
还有一个原因是因为有些应该会忽略 URL 中的 hash 部分,记得之前将 URL 使用微信分享时会丢失 hash 部分。
react-router和History简介
react-router
react-router是为react专门构建的一个路由插件,他可以帮助我们实现简单的单页应用效果,学习react的人,避免不了学习react-router的用法。
History
history 一个管理js应用session会话历史的js库。它将不同环境(浏览器,node...)的变量统一成了一个简易的API来管理历史堆栈、导航、确认跳转、以及sessions间的持续状态。
History基本 使用
import { createHistory } from 'history'