首先 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为什么推荐使用browserHistory而不推荐hashHistory?的更多相关文章

  1. [Web 前端] 你不知道的 React Router 4

    cp from https://segmentfault.com/a/1190000010718620 几个月前,React Router 4 发布,我能清晰地感觉到来自 Twitter 大家对新版本 ...

  2. React Router基础使用

    React是个技术栈,单单使用React很难构建复杂的Web应用程序,很多情况下我们需要引入其他相关的技术 React Router是React的路由库,保持相关页面部件与URL间的同步 下面就来简单 ...

  3. React Router 4.x 开发,这些雷区我们都帮你踩过了

    前言 在前端框架层出不穷的今天,React 以其虚拟 DOM .组件化开发思想等特性迅速占据了主流位置,成为前端开发工程师热衷的 Javascript 库.作为 React 体系中的重要组成部分:Re ...

  4. React Router基础教程

    React是个技术栈,单单使用React很难构建复杂的Web应用程序,很多情况下我们需要引入其他相关的技术 React Router是React的路由库,保持相关页面部件与URL间的同步 下面就来简单 ...

  5. React Router 4.0 体验

    React Router 4.0 (以下简称 RR4) 已经正式发布,它遵循React的设计理念,即万物皆组件.所以 RR4 只是一堆 提供了导航功能的组件(还有若干对象和方法),具有声明式(声明式编 ...

  6. React Router教程

    React Router教程 React项目的可用的路由库是React-Router,当然这也是官方支持的.它也分为: react-router 核心组件 react-router-dom 应用于浏览 ...

  7. React Router API文档

    React Router API文档 一.<BrowserRouter> 使用HTML5历史记录API(pushState,replaceState和popstate事件)的<Rou ...

  8. React Router学习

    React Router教程 本教程引用马伦老师的的教程 React项目的可用的路由库是React-Router,当然这也是官方支持的.它也分为: react-router 核心组件 react-ro ...

  9. 初步学习React Router 4.0

      React Router 4.0 是react官方推荐的路由库.4是已经正式发布的最新版本. 初始化项目启动之后: npm run eject 弹出配置文件.自定义配置webpack 查看下pac ...

随机推荐

  1. python基础,if判断

    一.计算机基础知识: 1.计算机基本组成:主板+CPU+内存 (CPU:主频,核数(16)   内存:大小,型号,主频   显卡:显存,位宽) 2.计算机最低层:电子电路,只能识别0和1. 二.pyt ...

  2. protobuf使用遇到的坑

    在这里具体的使用我不写了,可以参考下面接个连接,我只记录自己遇到的问题. https://www.cnblogs.com/autyinjing/p/6495103.html(此博客很详细,不过最好不要 ...

  3. typescript-学习使用ts-3

    函数 函数参数 参数及返回值类型 function add(x: number, y: number): number { return x + y } 可选参数 function add(x: nu ...

  4. 四、NOSQL之Redis持久化缓存服务基础实战第三部

    1.NOSQL的理解 NOSQL是不仅仅是SQL,说的就是sql的补充,但是不能替代SQL. nosql库:memcached.memcachedb.redis 2.redis 简介 Redis是一个 ...

  5. 1)PHP基础介绍

    1.php基础介绍: Perssonal Home Page  ====>PHP 2.应用范围 · web服务器脚本语言 命令行脚本语言     应用程序图形界面 3.PHP运行环境 PHP解释 ...

  6. java类为什么要实现Serializable接口

    什么是Serializable接口? 一个对象序列化的接口.一个类只有实现了Serializable接口,它的对象才能被序列化. 什么是序列化? 将对象的状态信息转换为可以存储或传输的形式的过程. 在 ...

  7. OpenSSL EVP_Digest系列函数的一个样例

    #include <stdio.h>     #include <openssl/evp.h>         main(int argc, char *argv[])     ...

  8. Qt的窗口如何显示在spi屏幕上

    问题:我们可以将qt移植到H3上,但是如果要将窗口通过spi屏进行显示应该怎么做呢,和framebuffer又有什么关系? 这里只说一下qt在spi屏上显示的技术原理,具体的实现还需要自己努力. 一. ...

  9. 十四、linux-MySQL的数据库集群读写分离及高可用性、备份等

    一.数据库集群及高可用性 二.mysql实现读写分离 mysql实现读写分离有多种方式: 1)代码语言(php\python\java等)层面实现读写分离,找开发进行实现. 2)通过软件工具实现读写分 ...

  10. CNN Mini-Fashion数据集以及Pytorch初体验

    下载Fasion-MNIST数据集 Fashion-MNIST是一个替代原始的MNIST手写数字数据集的另一个图像数据集. 它是由Zalando(一家德国的时尚科技公司)旗下的研究部门提供.其涵盖了来 ...