Так как мы можем один компонент встраивать в другой (как вложенность HTML) и потом получать через props return this.props.children, И тогда родительский компонент с методом componentDidCatch помогает отловить ошибки в дочернем элементе подробнее тут https://reactjs.org/docs/error-boundaries.html#introducing-error-boundaries
<ErrorBoundary key={index}>
<Car name={car.name} />
</ErrorBoundary>
// ----
import React, { Component } from 'react'
export default class ErrorBoundary extends Component {
state = { hasError: false }
// данный метод будет вызван если его дети выхватят ошиюку
// т е это обертка !
componentDidCatch(error, info) {
this.setState({hasError: true})
}
render() {
if (this.state.hasError) {
return <h1 style={{color: 'red'}}> Something went wrong </h1>
}
return this.props.children
}
}