IT이야기

Reducx 종속성은 변경되지 않았지만 후속 렌더링 후 useEffect run

cyworld 2022. 3. 24. 22:02
반응형

Reducx 종속성은 변경되지 않았지만 후속 렌더링 후 useEffect run

값비싼 부작용이 있는 반응 기능 구성 요소를 가지고 있다.

  useEffect(() => {
    doExpensiveSideEffect(reduxProp);
  }, [reduxProp]);

reduxPropRedex-connector를 통해 외부에서 공급되는 속성이다.이 질문에 대해서는 정확한 기원이 밝혀졌으면 한다.reduxProp상관없다

내 문제는 이다doExpensiveSideEffect필요 이상으로 자주 달리다

  • 첫 번째 렌더 다음에 실행되는데, 괜찮다.
  • 그것은 언제든지 실행된다.reduxProp재입고했어 그것도 괜찮아
  • 단, 다음 렌더링 후에도 계속 운행한다.reduxProp변하지 않았다!

이것이 내 질문으로 이어진다:후속 렌더링의 수와 관계없이 재할당된 경우에만 실행을 보장하려면 어떻게 해야 하는가?

편집:

구성요소는 라우터-하이저-오더-구성요소로 포장되어 있다는 점에 주목할 필요가 있다.라우팅은 IonReactRouter-Component에 의해 제어된다.IonReactRouter는 동일한 자식 구성 요소의 여러 인스턴스를 생성하며, 이것이 이 문제의 근본 원인일 수 있다고 생각한다.

IonReactRouter에 대한 자세한 내용은 https://ionicframework.com/docs/react/navigation을 참조하십시오.

더 나아가reduxProp을 통해 전달되다connect-기능react-redux. 그 사이에 사용자 정의 "선택자"를 사용하여 선택reduxProp전 세계 AppState에서.다음 코드는 글로벌 AppState에서 위에서 언급한 useEffect까지의 경로를 보여준다.

const OuterComponent = withRouter(
  connect<StateProps, DispatchProps, OwnProps, AppState>(
    (state: AppState, ownProps: OwnProps) => ({
      reduxProp: selectPartOfState(state, ownProps),
    }),
    {}
  )(InnerComponent)
);

지금InnerComponent받다reduxProp위에 언급한 useEffect를 포함하는 소품.

참조URL: https://stackoverflow.com/questions/61566172/react-useeffect-runs-after-subsequent-renders-although-redux-dependency-has-not

반응형