Как правильно отлавливать ошибки в react 16.x?

Question

[Сергей Сунцев]

Сделал согласно мануалу контейнер. Обернул им основные общие компоненты. и теперь если в каком то компоненте обнаружится ошибка, то я вывожу соответствующее сообщение.
В приложении структура, в которой одни компоненты располагаются внутри других и я все обернул в <ErrorBoundary>...</ErrorBoundary>
И хочется, что бы, если ошибка обнаружится в дочернем компоненте, то именно вместо него и рендерилась ошибка, а не вместо самого родительского компонента, который обернут в <ErrorBoundary>...</ErrorBoundary>

Интересно, в целом может есть где мануал про всплытие ошибок в реакте?

Answer 1

[Антон Спирин]

Оборачивайте дочерний компонент, в котором может возникнуть ошибка, в ErrorBoundary. Никакого особого механизма всплытия ошибок нет.

Comments

[Сергей Сунцев]

Так и делаю, просто странно, если ошибка в дочернем компоненте, то всплывает ошибка в родительском. Оставить только в дочернем не получится, покуда ошибка и в родительском тоже может быть.

[Антон Спирин]

Сергей Сунцев, так не должно быть. Если в ErrorBoundary у вас обернут дочерний компонент, то ошибка должна отлавливаться там, при этом родительский компонент должен рендериться, если он не рендерится значит ошибка происходит и там.

[Антон Спирин]

Сергей Сунцев, вот пример со счетчиками. Во втором блоке первые два обернуты в ErrorBoundary, третий нет. Кликните каждый с первого по последний по 5 раз и увидите разницу.

[Сергей Сунцев]

Антон Спирин,
Я componentDidCatch вынес из компонента ErrorBoundary.
Видимо из-за этого, попробую переделать.