React 요소의 오류로 인해 앱이 다시 렌더링되어 무한 루프가 발생합니다. 왜? 사람이 문제 다 퉜다 경우 아직 코드를 포함하지 않고

Question

가 궁금 어디 :

• 는 apollo-client
• 아이 컴포넌트는 connect에 싸여 적이 내 경우에는, connect에 싸여있는 구성 요소가 그
• 이 무한 루프를 받기 아이 컴퍼넌트에 componentWillMount
• 던져에서 오류를 파견 할

,536,

내가있는 상황은 부모 구성 요소가 render을 다시 실행하고 모든 자식이 componentWillMount을 실행하지만, componentWillUnmount을 실행하지 않는다는 것입니다.

오류는 기록되지 않으며 호출 스택 오버플로가 발생할 때까지 콘솔에 표시되지 않습니다.

이렇게하면 모두 다시 Redux에 연결되고, 작업을 디스패치하고 다시 마운트하기 때문에 오류가 다시 발생하므로 루프가 발생합니다.

나는 재현을 시도 할 수는 있지만 꽤 많은 시간이 걸릴 것입니다. 누군가가 어딘가에 볼 수있는 유사한 문제에 부딪혔습니까?

Answer 1

componentWillMount에서 작업을 보내지 마십시오. 변경할 수있는 것으로 간주되는 항목은 componentDidMount에서 수행해야합니다. componentWillMount는 생성자와 유사합니다. 구성 요소가 마운트되지 않았습니다. 구성 요소는 상태를 알지 못하지만 (지정하지 않는 한) componentDidMount에서 실제로 구성 요소가 마운트 될 때까지 상태가 충족되지 않습니다. 이상적으로는 생성자를 고수하고 실제로 componentWillMount를 사용하지 않아야합니다. API 호출 또는 디스패치의 경우 cDM으로 유지해야합니다.

Answer 2

Clayton이 맞습니다. ComponentWillMount은 한 번 방법 및 진실성이 있었음에도 불구하고 약간의 반 패턴입니다. 아마도 ComponentDidMount을 사용하고 싶을 것입니다.

그러나 던지는 것에 대해 언급 했으므로, React 16에는 componentDidCatch lifecycle hook이 없습니다. 대체의 UI

에게 그 오류를 기록,

오류 경계가 어디서든 자신의 하위 구성 요소 트리에서 자바 스크립트 오류를 ​​포착 구성 요소에 반응하고, 표시 :이 오류를 잡아에 그것을 처리 반응 할 수 있습니다 이론 상으로는 오류를 처리하고 connect의 회로를 단락시켜야합니다.