React路由器的公共路径url

react router public path url

本文关键字:路径 url 路由器 React      更新时间:2023-09-26

从我读到的所有教程中,他们使用并设置react-router,以"/"作为他们的路由路径,并将http://mysite.or/作为他们的域。如果我想要怎么办? http://mysite。或者/什么"作为我的基本路径(家)。我只需要把react-router上的"/"改成"/something"吗?或者有合适的方法来做这件事吗?

是的,如果你在父路由组件中使用path作为"/something",那么/something将是基路径。但最好在父组件中使用"/",然后创建一个基路径为"/something"的子组件

<Route path="/">
  <Route path="/something">
     //Put routes that needs base path as /something/...
  </Route>
</Route>

现在看来basename是正确的方式。

我喜欢使用PUBLIC_URL,这样我可以根据不同的部署场景更改它。

<Router basename={process.env.PUBLIC_URL}>
https://reactrouter.com/web/api/BrowserRouter/basename-string

::字符串

所有位置的基础URL。如果你的应用程序是从服务器上的子目录提供的,你会想把这个设置为子目录。一个正确格式化的基本名应该有一个前导斜杠,但没有尾斜杠。

<BrowserRouter basename="/calendar">
    <Link to="/today"/> // renders <a href="/calendar/today">
    <Link to="/tomorrow"/> // renders <a href="/calendar/tomorrow">
    ...
</BrowserRouter>