Question

我正在尝试在我的第一个真正的react和redux应用程序上启动并运行身份验证，但我仍然坚持管理路由访问和验证。

以下是我验证授权的代码：

export default function(ComposedComponent) {
  class Authentication extends Component {
    static contextTypes = {
      router: React.PropTypes.object
    }

    componentWillMount() {
      if (!this.props.authenticated) {
        this.context.router.push('/');
      }
    }

    componentWillUpdate(nextProps) {
      if (!nextProps.authenticated) {
        this.context.router.push('/');
      }
    }

    render() {
      return <ComposedComponent {...this.props} />
    }
  }

  function mapStateToProps(state) {
    return { authenticated: state.auth.authenticated };
  }

  return connect(mapStateToProps)(Authentication);
}

我正在导航并在我的路线上调用它：

class App extends Component {
  render() {
    return (
      <Router history={history}>
          <Layout>
            <Route path='/' exact component={Home} />
            <Route path='/signin' component={SignIn} />
            <Route path='/signout' component={SignOut} />
            <Route path='/brain' component={RequireAuth(Brain)} />
          </Layout>
      </Router>
    );
  }
}

export default App;

这是我得到的错误：

TypeError: Cannot read property 'object' of undefined
./src/components/auth/RequireAuth.js.__webpack_exports__.a
src/components/auth/RequireAuth.js:7
   4 | export default function(ComposedComponent) {
   5 |   class Authentication extends Component {
   6 |     static contextTypes = {
>  7 |       router: React.PropTypes.object
   8 |     }
   9 | 
  10 |     componentWillMount() {
View compiled

感谢您提供的任何指示！

Answer 1

你能试试吗？希望它有所帮助

static contextTypes = {
  router: React.PropTypes.func
}

'object'的属性未定义为object：React.PropTypes.object

1 个答案: