React Router - отрендерить элемент с нуля

Question

Делаю админку на реакте. Есть структура компонента App:

хэдер
сайдбар
свитч -> роуты, которые подружают страницы
футер

Все работает нормально, но сейчас я создал страницу логина (просто два поля и кнопка по центру), на которой нельзя показывать другие элементы (футер, сайдбар, хэдер).

Каким образом в роутах можно сделать рендеринг исключительно компонента login?

Answer 1

Убери layout на уровень ниже

App.js
<Switch>
      <Route path="/page" component={PageComponent} />
      <Route path="/login" component={LoginPage} />
</Switch>

PageComponent.js
<PageHeader />
<PageSidebar />
<PageMainContent>
    <Switch>
          <Route path="/some-route" component={SomeComponent} />
          <Route path="/some-route2" component={SomeComponent2} />
    </Switch>
</PageMainContent>

Answer 2

Не знаю, насколько идеологически правильно, но такой вот костыль перед return (<Router>... подошел:

if(window.location.pathname === '/login') return <Login />

БЛОГ НА HUSL

React Router - отрендерить элемент с нуля

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