Повторно отобразить заголовок после того, как пользователь войдет в систему или выйдет из системы в React

Question

, поэтому вопрос может показаться немного запутанным, поэтому позвольте мне объяснить, это мой индексный файл

<Router>
   <Header />
   <Switch>
      <Route exact path="/" component={HomePage} >
      </Route>
      <Route exact path="/Login/:step?" component={Login}>
      </Route>
   </Switch>
</Router>

, и вот в основном, как я могу попасть на главную страницу после входа пользователя в систему

this.props.history.push("/")

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

Answer 1

Поместите Header в HomePage

и, если вам нужно, поместите также на Login страницу .. но я не думаю, что логин требует того же заголовка, что и на домашней странице.

Основной компонент маршрутизатора должен быть чистым.

<Router>
   <Switch>
      <Route exact path="/" component={HomePage} >
        <Header />
      </Route>
      <Route exact path="/Login/:step?" component={Login}>
        <Header />
      </Route>
   </Switch>
</Router>

• Если ваше приложение становится большим для - обновите информацию о пользователе - подумайте об использовании управления состоянием, например Redux