Question

我目前正在开发一个事件管理应用程序，允许客户注册由多个活动组织者创建的活动。后端API路由如下所示：

http://my-app.com/eventorganizer1/events/event_id=1/new
http://my-app.com/eventorganizer1/events/event_id=2/new
http://my-app.com/eventorganizer2/events/event_id=1/new
http://my-app.com/eventorganizer3/events/event_id=1/new

不是通过React Router中的事件组织器明确声明所有路由，而是可以采用什么策略来动态生成它们（例如，假设所有事件组织器都存储在mongoose模型中）？r

Answer 1

对于子孙后代，我找到了问题的答案。

我的想法是通过类似map函数的方式从mongoose / array / API生成'Links'，然后使用React-Router汇集路由，最后通过match.params处理这些路由：

const EventOrganisers = () => (
  <div>
    <ul>
      {
        eventorganisersAPI.all().map(p => (
          <li key={p.number}>
            <Link to={`/eventorganiser/events/${p.number}`}>{p.name}</Link>
          </li>
        ))
      }
    </ul>
  </div>
)

...

<Route path='/eventorganiser/events/:event_id' component={Event}/>

Answer 2

如果要设置更通用的路由处理程序，则可以添加以下路由并创建一个组件来处理所有请求：

路由路径=“ *” component = {RouteHandler} />

动态生成React路由

2 个答案: