支持: react 16.0及其以上
说明:react的错误处理边界其实就是一个组件,并且只处理其children的错误,并且只能是类组件,children中出错误时,如果外面有Error Boundaries,那么错误会被捕获。
使用方法
首先创建一个类组件,并且在里面声明一个新的生命周期函数
class ErrorBoundary extends React.Component {
constructor(props) {
super(props);
this.state = { hasError: false };
}
componentDidCatch(error, info) {
this.setState({ hasError: true });
}
render() {
}
}
这样就声明了一个错误处理的组件,我们在componentDidCatch这个里面捕获到error和info(这是一个带有componentStack
的key值得object),然后就可以像普通组件一样使用它
<ErrorBoundary>
<Children />
</ErrorBoundary>
注意: 自从react16起,errors没有被任何错误边界组件捕获的将导致整个react组件树的卸载,