CODEWITHSUNDEEP
reactjsmeteorreact-router
mgons
mgons

Reputation: 343

What should I use in place of onEnter and onChange in router?

I am following a tutorial which is a bit old but I am using "react-router": "^5.0.0" I think it now do not support onEnter and OnChange. So what should i use instead while keeping same functionality.

export const globalOnChange = (prevState, nextState) => {
  globalOnEnter(nextState);
};

export const globalOnEnter = (nextState) => {
  const lastRoute = nextState.routes[nextState.routes.length - 1];
  Session.set('currentPagePrivacy', lastRoute.privacy);
  console.log('lastRoute',lastRoute);
};

export const routes = (
  <Router history = {browserHistory1}>
      <Route onEnter={globalOnEnter} onChange={globalOnChange}>
        <Switch>
          <Route exact path = "/" component={Login} privacy="unauth"/>
          <Route exact path = "/signup" component={Signup} privacy="unauth"/>
          <Route exact path = "/dashboard" component={Dashboard} privacy="auth"/>
          <Route exact path = "/test" component={Test} privacy="auth" onEnter={onEntertESTPage}/>
          <Route component={NotFound}/>
        </Switch>
      </Route>
  </Router>
);

Upvotes: 1

Views: 470

Answers (1)

Andreas Richter
Andreas Richter

Reputation: 788

onEnter no longer exists on react-router-4. With v4, you should use the lifecycle methods of the component rendered by a . Instead of onEnter, you would use componentDidMount.

https://github.com/ReactTraining/react-router/blob/master/packages/react-router/docs/guides/migrating.md#on-properties

So I would also recommend setting/checking the privacy rules in the component itself and not the router.

Upvotes: 1

Related Questions