[react-router]路由原理
[react-router]hashHistory和browserHistory的使用
react-router提供了三种方式来实现路由,并没有默认的路由,需要我们在声明路由的时候,显示制定使用的路由
v2.0.0的三种路由:
browerHistory
hashHistory
createMemoryHistory
// 使用的时候:
// hashHistory
import { hashHistory } from "react-router";
<Router history={hashHistory} />
官方推荐使用browerHistory
[react-router]hashHistory和browserHistory的区别
===== 视觉上的区别 =====
browerHistory更好一些,更加符合我们的审美观
使用hashHistory的时候,我们的路由是这样的: leafmaple.cn/#/git命令/
使用browerHistory的时候,我们的路由是这样的: leafmaple.cn/git命令/
===== 功能上的区别 =====
browerHistory需要服务端的支持, 而hashHistory不需要
使用hashHistory:
因为有 # 的存在,浏览器不会发送 request 请求,react-router会根据url去渲染相应的模块
使用browerHistory:
从 / 到 /git命令,浏览器会发送 request 请求,所有服务端需要做特殊的请求
for example :
使用express模块的时候,需要 handle 所有的路由 app.get('*', (req, res) => {...})
结束语
如果我们的只是静态页面的话,直接使用hashHistory就好了