5

由于 Web 应用程序上下文根的概念通常被认为是部署问题而不是开发问题，我想知道在使用 React Router 进行网页导航时是否可以不在源代码中硬编码上下文根。

我希望能够使用部署描述符（例如 web.xml）指定的任何上下文根来部署我的 Web 应用程序，而无需更改我的任何 React 源代码。

以下是跟进保罗的回答。

首先，非常感谢保罗。我完全同意在这方面可以使用“basename”属性。我们可以使用构建脚本将“baseName”替换为与部署描述符指定的最终上下文根匹配的不同值。

但是，我认为这样做只会隐藏而不是改变上下文根必须嵌入到源代码中的事实，这在概念上应该是部署问题。

我非常想知道为什么 React Router 选择不解析相对于上下文根的路径“/”，即将“/”匹配到“ http://host:port/webapp/ ”，或者至少提供一个选项，例如

<Route path="/" relativeToContextRoot="true" …&gt;

毕竟，不将上下文根的实际值视为开发问题与其说是例外，不如说是一种规范。这是提交给 React Route 团队的合理请求吗？

4

1 回答 1

0

React Router 允许您为应用程序指定基本名称。基名将从路径名中删除，并且位置将与路径的其余部分匹配。

例如，如果您将基本名称设置为/mysite，则请求/mysite/page-one将尝试将路径名/page-one与您定义的路由匹配。

动态设置 basename 值只需将值注入到代码中，以允许您的代码在创建history将由您的<Router>.

一种可能的解决方案是在window呈现 HTML 时设置一个变量。

<script>
window.__BASENAME__ = '/some/root';
</script>

然后，您可以在创建history实例时访问应用程序中的该值。

const BASENAME = window.__BASENAME__ || '/';
const history = useRouterHistory(createHistory)({
  basename: BASENAME
});
于 2017-01-07T13:42:54.773 回答