标签
note
字数
227 字
阅读时间
1 分钟
react-router-dom、react-router 和 router 三者关系
router 是三者核心，又称 history 库，集成了 popState、history.pushState 等路由底层方法
react-router 里面封装了 Router、Route、Switch 等核心组件，实现从路由的改变到组件的更新的核心功能
react-router-dom 添加了用于跳转的 Link 组件、history 模式下的 BrowserRouter 和 hash 模式下的 HashRouter 组件
页面更新逻辑
单页面应用路由的实现原理：监听 url 变化，切换 url，执行回调，渲染对应的页面组件
页面更新有两个出发点：
- 代码内部调用
history.push()方法 - 浏览器的前进后退按钮，改变 url
改变路由
- history 模式（BrowserRouter）
- history. pushState
- hisotry. replaceState
- hash 模式（HashRouter）
- window. location. hash
监听路由
- history 模式
- popstate 钩子
- hash 模式
- onhashchange 钩子
具体交互链路
贡献者
jiechen