Umi中 的 React 异常捕获组件在失效

Question

我的基础组件

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

  componentDidCatch(error, errorInfo) {
    this.setState({ hasError: true });
  }
  onError = () => {
    throw new Error('出现了错误');
  };
  render() {
    if (this.state.hasError) {
      return <h1>页面错误的安全页面</h1>;
    }

    return (
      <div>
        <h1
          onClick={() => {
            this.onError();
          }}
        >
          点我报错
        </h1>
        <div>{this.props.children}</div>
      </div>
    );
  }
}

  componentDidCatch(error, errorInfo) {
    this.setState({ hasError: true });
  }
  onError = () => {
    throw new Error('出现了错误');
  };
  render() {
    if (this.state.hasError) {
      return <h1>Something went wrong.</h1>;
    }

    return (
      <div>
        <h1
          onClick={() => {
            this.onError();
          }}
        >
          点我报错
        </h1>
        <div>{this.props.children}</div>
      </div>
    );
  }
}

然后点击报错按钮制造一个错误,然后componentDidCatch钩子是捕捉到了信息,到时界面还是崩溃了,该怎么解决,使得页面出现异常崩溃时,显示 '页面错误的安全页面'