当前位置: 首页 > Web前端 > HTML

ReactErrorBoundary处理自定义错误

时间:2023-03-28 01:32:12 HTML

ErrorBoundary处理自定义错误背景ErrorBoundary是一个React组件,它捕获其子组件树中任何位置发生的JavaScript错误,并在显示降级UI时打印它们。问题是react只能在以下3种实现下捕获错误。渲染时的生命周期方法整个组件树的构造函数不能自动捕获以下4种实现事件处理异步代码(如setTimeout、Promise回调函数)服务端渲染自己抛出的错误(不是其子组件)通常希望业务代码可以重用ErrorBoundary的错误处理逻辑。如果你想让ErrorBoundary为业务代码处理自定义错误,渲染时抛出错误即可。ClassComponenttry{constres=awaitfetchMayError();}catch(err){this.setState(()=>{throwerr;});}HooksfunctionuseErrorHandler(){const[error,setError]=React.useState(null);如果(错误!=null)抛出错误;返回setError;}functionFoo(){consthandleError=useErrorHandler();fetchMayError().catch(handleError);return

;}灵感https://github.com/bvaughn/re...