Блокировка маршрута реакции

Question

Я использую тему с именем Core-UI, и маршрутизация внутри кода немного отличается.Я запутался в том, как заблокировать определенный маршрут в app.js, который в конечном итоге ведет ко всем маршрутам.

Я пробовал решения в соответствующей теме, но не повезло.

Это из app.js

<BrowserRouter>
      <React.Suspense fallback={loading()}>
        <Switch>
          <Route exact path="/" name="Login Page" render={props => <Login {...props} />} />
          <Route exact path="/login" name="Login Page" render={props => <Login {...props} />} />
          <Route exact path="/404" name="Page 404" render={props => <Page404 {...props} />} />
          <Route exact path="/500" name="Page 500" render={props => <Page500 {...props} />} />
          <Route path="/" name="Home" render={props => <DefaultLayout {...props} />} />
        </Switch>
      </React.Suspense>

<Route path="/" name="Home" render={props => <DefaultLayout {...props} />} />

Это маршрут, который я хочу заблокировать с помощью localStorage.Я пробовал это, но это не удалось:

<Route path="/" name="Home" render={props => 
            localStorage.getItem('jwtToken') !== null
            ? (
              <DefaultLayout {...props} />
            ) : (
              <Redirect to={{ pathname: "/login" }} />
            )
          } 
/>

Если понадобятся какие-либо другие файлы, я предоставлю их.Спасибо.

Answer 1

на основе вашего кода у вас есть два маршрута для входа в систему "/" и дома

   <Switch>
          <Route path="/" name="Home" render={props => 
            localStorage.getItem('jwtToken') !== null
            ? (
              <DefaultLayout {...props} />
            ) : (
              <Redirect to={{ pathname: "/login" }} />
            )
          } />

          <Route exact path="/login" name="Login Page" render={props => <Login {...props} />} />
          <Route exact path="/login" name="Login Page" render={props => <Login {...props} />} />
          <Route exact path="/404" name="Page 404" render={props => <Page404 {...props} />} />
          <Route exact path="/500" name="Page 500" render={props => <Page500 {...props} />} />
          <Route path="/" name="Home" render={props => <DefaultLayout {...props} />} />
        </Switch>