React-Router에서 onEnter가 호출되지 않았습니다.

React-Router에서 onEnter가 호출되지 않았습니다.

---

좋아, 나는 시도하는 데 지쳤다. 방법은 작동하지 않습니다. 그 이유는 무엇입니까?
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")

편집하다:

이 메서드는을 호출 할 때 실행 onEnter={requireAuth()}되지만 분명히 목적이 아니며 원하는 매개 변수도 얻지 못할 것입니다.

---

onEnter에 더 이상 존재하지 않습니다 react-router-4. <Route render={ ... } />원하는 기능을 얻으려면을 사용해야 합니다. 나는 Redirect예에 특정 시나리오가 있다고 생각 합니다. 귀하의 것과 일치하도록 아래에서 수정했습니다.

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

---

v2 / v3에서 v4로 마이그레이션 하는 문서에 따라 react-router-v4 onEnter,, onUpdate에서 onLeave제거되었습니다 .

on*속성은
라우터 V3가 제공하는 반작용 onEnter, onUpdate및 onLeave방법. 이들은 본질적으로 React의 라이프 사이클 방법을 재창조했습니다.

v4에서는 .NET Framework에서 렌더링 한 구성 요소의 수명주기 메서드를 사용해야합니다 <Route>. 대신 또는 onEnter을 사용 합니다. 을 사용하는 경우 또는 (또는 가능하면 )를 사용할 수 있습니다 . 로 바꿀 수 있습니다 .componentDidMountcomponentWillMountonUpdatecomponentDidUpdatecomponentWillUpdatecomponentWillReceivePropsonLeavecomponentWillUnmount

참조 URL : https://stackoverflow.com/questions/42768620/onenter-not-called-in-react-router