此问题已在此处有答案：

React child nested routes（1个答案）
2天前关闭。
我正在尝试将我的身份验证路由与应用内容路由分开：
App.jsx:

<BrowserRouter history={history}>
  <Switch>
    <Route
      exact
      path={`${process.env.REACT_APP_ROUTE_PREFIX}`}
      component={PrivateRouteWrapper}
    />
    <Route
      exact
      path={`${process.env.REACT_APP_ROUTE_PREFIX}/login`}
      component={LoginPage}
    />
    <Route
      exact
      path={`${process.env.REACT_APP_ROUTE_PREFIX}/signup`} 
      component={SignupPage}
    />
  </Switch>
</BrowserRouter>

PrivateRouteWrapper.jsx:

<React.Fragment>
  <PrivateRoute
    exact
    path={process.env.REACT_APP_ROUTE_PREFIX}
    component={Page1}
    titleText={"Quest"}
    titleVisibility={true}
  />
  <PrivateRoute
    exact
    path={`${process.env.REACT_APP_ROUTE_PREFIX}/page2`}
    component={Page2}
  />
  <MyComponentSharedBetweenPages />
</React.Fragment>

PrivateRoute.jsx:

const PrivateRoute = ({ component: Component, ...rest }) => (
  <Route
    {...rest}
    render={props => loggedIn
      ? <Component {...props} />
      : <Redirect
          to={{ pathname: `${process.env.REACT_APP_ROUTE_PREFIX}/login` }}
        />
    }
  />
);

登录、注册和page1路由之间的路由工作正常。但是当我试着去第2页的时候，页面变得空白。
我做错了什么？