IT技术 - React 路由器：我不希望用户通过键入 url 直接导航到页面，但允许仅使用应用程序内的链接访问页面。 - 吾爱随笔录

我的 Routes.js

<Route path="/game-center" component={GameCenter} />
      <Route path="/game-center/pickAndWin" component={PickAndWin} />
      <Route path="/game-center/memory" component={Memory} />
      <Route path="/game-center/summary" component={GameSummary} />
    </Route>
  </Router>

在卡上单击我将他路由到游戏或摘要，具体取决于游戏是实时还是过期。

cardClick=(type, name, status, gameId) => {
    console.log(`here${type}${status}`, name);
    this.props.dispatch(GameCenterActions.setShowGame());
    if (status === LIVE) {
      this.props.dispatch(GameCenterActions.selectGame({ type, name, status, gameId }));
      this.props.dispatch(GameCenterActions.resetShowSummary());
      hashHistory.push(LIVE_GAMES[type]);
    } else if (status === EXPIRED) {
      this.props.dispatch(GameCenterActions.setShowSummary());
      console.log(`${EXPIRED_GAMES}summary page here`);
      this.props.dispatch(GameCenterActions.selectGame({ type, name, status, gameId }));
      hashHistory.push('/game-center/summary');
    }
  }

当用户直接输入 url '/game-center/summary' 时，他不应该被允许并且应该被发送回主页。这在react-router本身中可能吗？我想在我的整个应用程序中实现这一点。我不希望用户通过输入 url 直接导航到页面，而是只使用应用程序内的链接访问页面。

import React,{Component} from 'react'; import {connect} from 'react-redux'; export default function(ComposedComponent){ class Authentication extends Component{ static contextTypes = { router : React.PropTypes.object } componentWillMount(){ if(!this.props.user){ this.context.router.push('/'); } } componentWillUpdate(nextProps){ if(!nextProps.user){ this.context.router.push('/'); } } render(){ return(<ComposedComponent {...this.props}/>); } } }