componentDidUpdate
方法中,并且由某一个深层组件树的 setState
引起,其仍然能够冒泡到最近的错误边界。
错误边界无法捕获事件处理器内部的错误。
React 不需要错误边界来捕获事件处理器中的错误。
与 render 方法和生命周期方法不同,事件处理器不会在渲染期间触发。
因此,如果它们抛出异常,React 仍然能够知道需要在屏幕上显示什么。
如果你需要在事件处理器内部捕获错误,使用普通的 JavaScript try
/ catch
语句:
//在事件处理器中使用try/catch捕获事件内部错误 class ErrorBoundary extends React.Component { constructor(props) { super(props); this.state = { error: null }; this.handleClick = this.handleClick.bind(this); } handleClick() { try { // 执行操作,如有错误则会抛出 } catch (error) { this.setState({ error }); } } render() { if (this.state.error) { return <h1>Caught an error.</h1> } return <button onClick={this.handleClick}>Click Me</button> } } export default ErrorBoundary;