React-Router noMatch导致asteroid.userId返回falsey

Question

注意第Users.methods.isAuthed()行，您可以看到其调用!!asteroid.userId。我的登录表单工作正常，但我正在尝试建立一个react-router授权墙，这意味着当授权检查返回true时，路由器将加载该组件。

我进一步调查过，在传递与此指南匹配的404网址后，Users.methods.isAuthed（）会返回false：https://reacttraining.com/react-router/web/example/no-match

/src/components/PrivatePage.tsx

// almost identical to ./PrivateRoute.tsx

import * as React from 'react'
import { Redirect, Route } from 'react-router-dom'
import User from '../data/users'
import Page from './Page'

const PrivatePage = ({ component: Component, ...rest }) => (
  <Route {...rest} render={props => (
    User.methods.isAuthed() ? (  **// after page 'notFound' this returns false**
      <Page>
        <Component {...props}/>
      </Page>
    ) : (
      <Redirect to={{
        pathname: '/redirect',
        state: { from: props.location }
      }}/>
    )
  )}/>
)

export default PrivatePage

/src/data/users.tsx

import asteroid from '../asteroid/'

interface IUsers {
  methods: {
    isAuthed: () => boolean
  }
}

const Users: IUsers = {
  methods: {
    isAuthed() {
      const result = !!asteroid.userId
      console.log({isAuthed: result})
      return result
    }
  }
}

export default Users

/routes/App.tsx

import * as React from 'react'
import { Route, Switch } from 'react-router-dom'

import PrivatePage from '../components/PrivatePage'
import Login from './accounts/auth/'
import About from './root/About'
import Home from './root/Home'
import NotAuthorized from './root/NotAuthorized'
import NotFound from './root/NotFound'

interface IProps {}
interface IState {
  isAuthorized: boolean
}

class App extends React.Component<IProps, IState> {
  render() {
    const Content = () => (
      <div id='app-content'>
        <Switch>
          <Route path='/login' component={Login}/>
          <Route path='/redirect' component={NotAuthorized}/>
          <PrivatePage 
            path='/'
            component={Home}
            exact={true}
          />
          <PrivatePage 
            path='/about'
            component={About}
          />
          <PrivatePage component={NotFound}/>
        </Switch>        
      </div>
    )

    return (
      <div id='app-container'>
        <Content />
      </div>
    )
  }
}

export default App