반응형
Reducx 종속성은 변경되지 않았지만 후속 렌더링 후 useEffect run
값비싼 부작용이 있는 반응 기능 구성 요소를 가지고 있다.
useEffect(() => {
doExpensiveSideEffect(reduxProp);
}, [reduxProp]);
reduxProp
Redex-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를 포함하는 소품.
반응형
'IT이야기' 카테고리의 다른 글
파괴 할당과 선택적 체인을 어떻게 결합할 수 있는가? (0) | 2022.03.24 |
---|---|
vue 하위 구성 요소에서 RouteEnter가 작동하지 않음 (0) | 2022.03.24 |
Vuetify : 스로틀/차단 v-autocomplete (0) | 2022.03.24 |
여러 Vuex 경로에서 데이터를 로드하려면 다중 사용 Vue 구성 요소를 어떻게 구성해야 하는가? (0) | 2022.03.24 |
반응형 최초 발사를 탐지하는 방법 (0) | 2022.03.24 |