我在反应路由器 2.x 配置方面遇到了一些困难，特别是应用程序基本名称。
我有一个应用程序，在其整个生命周期中可能有不同的基本根。例如：
-
/开发中
-
/users生产中
-
/account迁移后投入生产
基本名称在几个地方发挥作用：
- Webpack 中的静态资源编译
- 反应路由器主要配置
- 在 redux actions 中指定重定向路由
- 提供类似的东西
redirectUrl到 API 调用
我当前的解决方案是拥有一个 ENV 变量，并通过注入使其可用于 Webpack 和应用程序本身window.defs通过 Express 服务器，但我最终仍然遇到类似的情况${defs.APP_BASENAME}/signin在整个应用程序的太多地方。
如何抽象应用程序基础，或者至少将其隐藏在一个位置？我应该能够在路由器的配置中指定基本路由，然后以某种方式简单地使用相对路由，对吧？或者我错过了什么？
你可以装饰你的history with a basename https://github.com/ReactTraining/react-router/blob/v3.0.0/docs/guides/Histories.md#examples。你可以将它与DefinePlugin在您的 Webpack 配置中指定应使用哪个基本名称。
// webpack.config.js
new Webpack.DefinePlugin({
BASENAME: '/users'
})
// somewhere in your application
import { useRouterHistory } from 'react-router'
import { createHistory } from 'history'
const history = useRouterHistory(createHistory)({
basename: BASENAME
})
给定基本名称：/users, React Router 会忽略/users在路径名的开头，这样：
The URL /users与路径内部匹配/
The URL /users/profile匹配路径/profile.
同样，当您在应用程序中导航时，不必将基本名称附加到路径中。
-
<Link to='/friends'>Friends</Link>将导航至/friends内部，但地址栏中的 URL 将是/users/friends.
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
