90 - 《Bigfish 4 特性 02：React Router 6 和新路由》

4 月会更新 20 篇 Bigfish 4（含 Umi 4）的新特性，这是第二篇。

React Router 6

React Router 是 Bigfish 的重要依赖，Bigfish 基于此实现路由功能，Bigfish 4 从 React Router 5 升级到了 React Router 6。

我个人太喜欢 React Router 6 这个版本了。大家应该都听说过 Remix 框架，和 React Router 出自同一个团队。由于他们自己也要做框架，所以 React Router 6 面向框架也做了很多优化，基于此，Bigfish 删了好多路由渲染和请求策略类的代码，因为这些在 React Router 中已内置处理。

大版本意味着 Break Change，而且还不少。但对于 Bigfish 用户来说，却又不多。因为我们之前使用 React Router 的方式是有节制的，比如没有开放 Route、Routes 和 Switch 的使用。一些值得注意的 Break Change 如下：

1、父路由渲染子路由，之前是 props.children，现在是
2、之前路由组件 props 里能拿到的 location、history、match 等信息，现在可通过 useRouteData() 获取（好处是 props 只能在当前路由组件中获取，而 hooks 的方式在子组件中也能使用，减少了 props 的传递）
Over。

其他会在框架层做兼容。

新路由

除了 React Router 6，我们对内部路由的数据结构也做了调整。

- 文件/配置 ➡ routes ➡ 渲染
+ 文件/配置 ➡ routesById ➡ routes