Использовать компонент из переменной JSX

Делаю роунтинг для своего проекта. Вынес данные роутера в отдельный json файл. Каждый элемент роутера содержит path, exact, component. Помимо этого всего я еще храню Layout как отдельный компонент. Выходит так, что мне нужно вызвать компонент, зная его называния. В старом виде я имею:

  <Switch>
        <Route exact
               path="/login"
               component={() => (
                 <LayoutLogin margin>
                   <LoginPage/>
                 </LayoutLogin>
               )}
        />
        <Route exact
               path="/"
               component={() => (
                 <LayoutDefault margin>
                   <ComplaintsPage/>
                 </LayoutDefault>
               )}
        />
    {/*....*/
  <Switch>

Примерно такое хотел сделать. К сожалению моего опыта не достаточно.

{router.map((item, index) => {

  <Route {item.exact? 'exact':''}
               path={item.path}
               component={() => (
                 <{item.layout}>
                   <item.component/>
                 </{item.layout}>
               )}
        />
)}

Ответы (0 шт):