React Catch-All с отдельными страницами

Question

Я вижу много решений о том, как создать маршрут не найденных страниц в SPA, но не могу найти ничего для SPA, который также использует отдельные страницы (например, логин).

Например:

<Router>
  <Switch>
    <Route path="/login" component={Login} />
    <Route path="/" component={Main} />
    ** a catch all route wouldn't work here **
  </Switch>
</Router>

Полный маршрут не будет работать выше с чем-то вроде <Route component={NotFound} />, потому что путь будет срабатывать при любом значении от path='/'.Если я переключусь на exact path='/', то не смогу получить доступ к localhost:3000/users с URL-адреса, который мне нужен, когда пользователь вошел в систему.

Main:

<Switch>
  <div className="someclass">  
    <Header />
    <Route exact path='users' component={Users} />
    <Footer />
  </div>
  <Route component={NotFound} /> . ** This also doesn't work here **
</Switch>

Answer 1

Посмотрите на приведенный ниже код для достижения желаемого результата:

               <Switch>                  
                {this.props.notLoggedIn === true
                  ? <Route path='/' component={LandingPage}/>                                          
                  : <Dashboard />                    
                }
                <Route component={PageNotFound}/>
              </Switch>    

В приведенном выше случае я показываю целевую страницу в качестве маршрута по умолчанию, и в случае, если пользователь вошел в систему на приборной панели, отображается(содержит больше маршрутов).Чтобы контролировать, аутентифицирован ли пользователь или нет, я устанавливаю состояние auth через отправку на целевой странице, например

handleSubmit = (e) => {
    e.preventDefault()

    const { value} = this.state  
    const { dispatch } = this.props

    dispatch(setAuthedUser(value))
  }

. После этого в моем приложении я могу получить к нему доступ и установить * 1008.* опораСм.

function mapStateToProps ({ authedUser }) {
  return {
    notLoggedIn: authedUser === null
  }
}

Если не найдено ни одного маршрута, отображается компонент PageNotFound.

Полный код можно посмотреть в репо: Репо