React路由之HashHistory以及BrowserHistory

原

React路由之HashHistory以及BrowserHistory

2018年05月04日 00:54:43 阅读数：112 标签： hash history 路由 更多

个人分类： react

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/mapbar_front/article/details/80189402

在Reacttraining的官方文档中，是这样描述history路由的实现的。

它拥有三个创建history的方法：

1. createBrowserHistory：支持H5的history Api
2. createMemoryHistory：一般React Native会支持这样的history
3. createHashHistory：支持旧浏览器的hash history Api

使用BrowserHistory的时候，会有一个比较麻烦的地方，你们的后台需要配置一个html界面，因为这样的路径会在浏览器刷新的时候进行发送请求。

一般我们前端会使用hashHistory的方式来解决这些问题。在浏览器刷新的时候，就不会发生发送请求的问题。

从实现的原理上：BrowserHistory的实现方式是一种H5的history API。

它包含三个方法：pushState、replaceState、popState

hashHistory的实现方式是一种location.hash的方式。其核心就是触发hashChange事件。