To redirect run

Question

我有一个包含公共和私人对象的集合。那些公开的人应该能够被所有人看到，私人的 - 只有他们的主人才能看到。我在react-router v4中有以下路线：

const Routes = () => (
<BrowserRouter>
    <div>
        <Header />
        <Sidebar />
        <Switch>
            <Route path="/" component={Index} exact={true} />
            <Route path="/admin" component={Admin} />
            <Route path="/list/:id" component={OneList} />
            <Route path="/dashboard" component={Dashboard} />
            <Route path="/login" component={Login} />
            <Route path="/signup" component={Signup} />
        </Switch>
        <Footer />
    </div>
</BrowserRouter>
);

如果没有列表（或者用户没有权利看到它，因为它是私有的并且由其他人拥有），我想重定向，如果有人进入/list/:id链接。< / p>

我尝试在OneList组件中管理它，该组件使用withTracker来获取其数据：

export default withTracker((props) => {
  const data = Meteor.subscribe('database');
  const myLists = Meteor.subscribe('myLists');
  const publicLists = Meteor.subscribe('publicLists');

  const list = List.findOne({_id: props.match.params.id});
  if (list === undefined){
    props.history.push('/');
  } else {
    return {
      currentUser: Meteor.user(),
      listLoading: !publicLists.ready() && !data.ready() && !myLists.ready(),
      list,
      database: Database.find({}).fetch(),
    };
  }
})(OneList);

但是当我这样做时，我得到了以下错误：

es5-shim.js?hash=c070fc7…:1240 Uncaught TypeError: Cannot convert undefined or null to object
    at keys (<anonymous>)
    at Function.keys (es5-shim.js?hash=c070fc7…:1240)
    at MeteorDataManager.calculateData (ReactMeteorData.jsx:85)
    at ReactMeteorDataComponent.componentWillMount (ReactMeteorData.jsx:130)
    at callComponentWillMount (modules.js?hash=abbf998…:14583)
    at mountClassInstance (modules.js?hash=abbf998…:14640)
    at updateClassComponent (modules.js?hash=abbf998…:15022)
    at beginWork (modules.js?hash=abbf998…:15411)
    at performUnitOfWork (modules.js?hash=abbf998…:17379)
    at workLoop (modules.js?hash=abbf998…:17488)

modules.js?hash=abbf998…:13111 The above error occurred in the <ReactMeteorDataComponent> component:
    in ReactMeteorDataComponent (created by Route)
    in Route (created by Routes)
    in Switch (created by Routes)
    in div (created by Routes)
    in Router (created by BrowserRouter)
    in BrowserRouter (created by Routes)
    in Routes

Consider adding an error boundary to your tree to customize error handling behavior.
You can learn more about error boundaries at /react-error-boundaries.

modules.js?hash=abbf998…:17685 Uncaught TypeError: Cannot convert undefined or null to object
    at keys (<anonymous>)
    at Function.keys (es5-shim.js?hash=c070fc7…:1240)
    at MeteorDataManager.calculateData (ReactMeteorData.jsx:85)
    at ReactMeteorDataComponent.componentWillMount (ReactMeteorData.jsx:130)
    at callComponentWillMount (modules.js?hash=abbf998…:14583)
    at mountClassInstance (modules.js?hash=abbf998…:14640)
    at updateClassComponent (modules.js?hash=abbf998…:15022)
    at beginWork (modules.js?hash=abbf998…:15411)
    at performUnitOfWork (modules.js?hash=abbf998…:17379)
    at workLoop (modules.js?hash=abbf998…:17488)

从我的研究中可能是因为我没有从withTracker返回一个对象，但我不想，因为我想重定向。

知道如何解决这个问题吗？也许我的检查和重定向应该在路由器内完成？

Answer 1

To redirect run

meteor npm install react-router

To redirect in react-router v4 you have to do it in the render function.

(list === undefined) &&
  <Redirect to={'/Home'}/>

This is a normal if statement or you can do

(list === undefined) ?
  <Redirect to={'/Home'}/>
:
  <Redirect to={'/Login'}/>

Answer 2

您可能（未经测试）插入

<Redirect to={'/login'}/>

作为OneList的道具，也在withTracker包装内。

Meteor / React / React-Router4 - 在HoC withTracker

2 个答案:

To redirect run