Question

我想在React中构建一个主网站的子路径。我怀疑如何在React路由器中构建路由。

EG。主网站起始于＆＃39; /＆＃39;当＆＃39; /反应＆＃39;出现反应 app应该接管。

路由应该如何构成

<Route path="/">
  <Route path="/react">
    //...rest of the child routes
  </Route>
</Route>

OR

应该有一个服务器端快速路由＆＃34; / react＆＃34;启动反应应用程序像这样的东西

app.get('/react',(req,res)=>{
  match({history,routes,location},(error,redirect,renderProps)=>{
       //..rest of the code
  })
})

在这种情况下，路线可以这样结构吗？

<Route path='/'>
 <IndexRoute/>
//..rest of the routes
</Route>

Answer 1

使用React Router组件，您只能在客户端指定路由。所以在服务器端它应该是这样的：

app.get('*',(req,res)=>{
   // return Index page for every GET request
})

在客户端，没有一种正确的方法可以实现这一点。最简单的方法是使用这样的嵌套路由：

<Route path="/">
  <Route path="/react">
    //...rest of the child routes
  </Route>
</Route>

使用/react路由创建变量并将其插入核心路由的另一种方法（您可以在将来从另一个文件导入此变量并实现路由器的模块结构）：

const reactSubRoute = 
        <Route path="/react">
           //...rest of the child routes
        </Route>

<Route path="/">
   {reactSubRoute}
</Route>

对于您的情况，可能不需要使用<IndexRoute />。如果您想了解有关<IndexRoute /> read this article.

的更多信息，请参阅

在现有网站的子路由中重用应用程序

1 个答案: