@fruits-chain/react-native-xiaoshu/lib/module/error-boundary/index.js

🌈 React Native UI library

function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }

import React, { PureComponent } from 'react';
import Button from '../button';
import Result from '../result';
import ResultIconError from '../result/icons/result-icon-error';
const ERROR_PAGE_STYLE = {
  flex: 1,
  backgroundColor: '#fff'
};
/**
 * ErrorBoundary 错误捕获
 * @description 一般用于应用根组件，捕获 React 内产生的问题。
 */

class ErrorBoundary extends PureComponent {
  constructor() {
    super(...arguments);

    _defineProperty(this, "state", {
      error: null
    });

    _defineProperty(this, "onPressReload", () => {
      this.setState({
        error: null
      });
    });
  }

  static getDerivedStateFromError(error) {
    // 更新 state，下次渲染可以展示错误相关的 UI
    return {
      error
    };
  }

  componentDidCatch(error, info) {
    var _this$props$onError, _this$props;

    (_this$props$onError = (_this$props = this.props).onError) === null || _this$props$onError === void 0 ? void 0 : _this$props$onError.call(_this$props, error, info);
  }
  /**
   * 点击清空错误，重新渲染子组件
   */


  render() {
    if (this.state.error) {
      // 渲染出错时的 UI
      if (this.props.renderError) {
        return this.props.renderError({
          name: this.state.error.name,
          message: this.state.error.message,
          onReset: this.onPressReload
        });
      }

      return /*#__PURE__*/React.createElement(Result, {
        style: ERROR_PAGE_STYLE,
        status: "error",
        renderIcon: () => /*#__PURE__*/React.createElement(ResultIconError, null),
        subtitle: `${this.props.title || '加载失败，请稍后再试~'}\n${this.state.error.name}\n${this.state.error.message}`,
        extra: /*#__PURE__*/React.createElement(Button, {
          type: "primary",
          size: "s",
          text: this.props.reloadText || '重新加载',
          onPress: this.onPressReload
        })
      });
    }

    return this.props.children;
  }

}

export default ErrorBoundary;
//# sourceMappingURL=index.js.map