Reactjs React路由器v5独立组件内的嵌套路由

我正在尝试将我的身份验证路由与应用程序内容路由分开：

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` }} />}
  />
);

const PrivateRoute=（{component:component，…rest}）=>(
洛格丁
? 
: }
/>
);

登录、注册和page1路由之间的路由工作正常。但当我尝试转到第2页时，页面变为空白

我做错了什么？

我明白了： 我从Route中删除了确切的属性，并将其移动到App.jsx中列表的末尾：

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