React中如何优雅的捕捉事件错误

发布网友发布时间：2022-04-22 19:38

共1个回答

热心网友时间：2022-04-22 16:04

1. EerrorBoundary

EerrorBoundary是16版本出来的，有人问那我的15版本呢，我不听我不听，反正我用16，当然15有unstable_handleError。
关于EerrorBoundary官网介绍比较详细，这个不是重点，重点是他能捕捉哪些异常。

Error boundaries在rendering，lifeCyclemethod或处于他们树层级之下的构造函数中捕获错误
哦，原来如此。怎么用

class ErrorBoundary extends React.Component {  constructor(props) {    super(props);    this.state = { hasError: false };
  }

  componentDidCatch(error, info) {    // Display fallback UI
    this.setState({ hasError: true });    // You can also log the error to an error reporting service
    logErrorToMyService(error, info);
  }

  render() {    if (this.state.hasError) {      // You can render any custom fallback UI
      return <h1>Something went wrong.</h1>;
    }    return this.props.children;
  }
}

<ErrorBoundary>  <MyWidget /></ErrorBoundary>