可以在React Router中为路由混合使用JSX和常规对象吗？

Question

使用React Router，我看到here我可以将路由定义为JSX或只是普通对象。我有一个用例，我想将settingsRoutes与我的应用程序的另一部分作为普通对象共享，但仍然使用JSX作为其他路由。第二个代码块就是我想做的事情。 JSX和对象的混合是否可能与反应路由器混合？

const settingsRoutes = [{
  path: 'settings',
  component: Settings,
  childRoutes: [
    {
      path: 'info',
      component: SettingsInfo
    }
  ]
}]

module.exports = settingsRoutes

var settingsRoutes = require('settingsRoutes')

<Route path='/' component={ Container }>
  <Route path='register' component={ Register } />
  <Route path='signin' component={ Signin } />
  <Route path='signout' component={ Signout } } />
  { settingsRoutes }
</Route>

Answer 1

这样做：

<Route path='/' component={ Container }>
  <Route path='register' component={ Register } />
  <Route path='signin' component={ Signin } />
  <Route path='signout' component={ Signout } } />
  <Route childRoutes={settingsRoutes} />
</Route>