Question

好的，我厌倦了尝试 undefined方法不起作用。知道为什么会这样吗？

onEnter

编辑：

当我调用// Authentication "before" filter function requireAuth(nextState, replace){ console.log("called"); // => Is not triggered at all if (!isLoggedIn()) { replace({ pathname: '/front' }) } } // Render the app render( <Provider store={store}> <Router history={history}> <App> <Switch> <Route path="/front" component={Front} /> <Route path="/home" component={Home} onEnter={requireAuth} /> <Route exact path="/" component={Home} onEnter={requireAuth} /> <Route path="*" component={NoMatch} /> </Switch> </App> </Router> </Provider>, document.getElementById("lf-app")时执行该方法，但显然这不是目的，我也不会得到所需的参数。

Answer 1

onEnter上不再存在

react-router-4。您应该使用<Route render={ ... } />来获得所需的功能。我相信Redirect示例有您的具体方案。我在下面修改它以匹配你的。

<Route exact path="/home" render={() => (
  isLoggedIn() ? (
    <Redirect to="/front"/>
  ) : (
    <Home />
  )
)}/>

Answer 2

来自react-router-v4 onEnter，onUpdate和onLeave已删除，根据{{3}}上的文件：

on*属性
   React Router v3提供onEnter，onUpdate和onLeave   方法。这些本质上是重建React的生命周期方法。

使用v4，您应该使用组件的生命周期方法   由<Route>呈现。你会使用而不是onEnter   componentDidMount或componentWillMount。您将使用onUpdate的位置，   您可以使用componentDidUpdate或componentWillUpdate（或可能   componentWillReceiveProps）。 onLeave可以替换为componentWillUnmount   {{1}}。

onEnter未在React-Router中调用

2 个答案: