react-错误时直接白屏怎么办---错误边界

参考链接 https://www.51cto.com/article/769003.html

import React from "react";
import {Text} from 'react-native'

class ErrorBoundary extends React.Component {
    constructor(props) {
      super(props);
      this.state = { hasError: false };
    }
  
    static getDerivedStateFromError(error) {
      // 更新 state,下一次渲染将展示备选 UI。
      console.log(`ErrorBoundary---error---`, error)
      return { hasError: true };
    }
  
    componentDidCatch(error, errorInfo) {
      console.log(error, errorInfo);
    }
  
    render() {
      if (this.state.hasError) {
        // 可以渲染任意自定义的备选 UI
        return <Text>出错啦!</Text>;
      }
  
      return this.props.children; 
    }
  }

  export default ErrorBoundary;

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容