react 组件错误边界处理

避免一个组件错误导致整个页面白屏不能使用等情况
方式一:手写
	1、创建一个边界组件,将可能发生错误的组件当作插槽,插入边界组件内
	
	2、边界组件中使用componentDidCatch生命周期函数,当组件发生错误的时候触发
		componentDidCatch(err,errInfo)
		{
			...
		}
	3、插槽在组件中显示
		this.props.children;
		
	4、将错误处理函数当作参数传递给边界组件
		<边界组件 xx={(?,??)=><p>组件错误</p>}> 
			<可能错误组件 />
		</边界组件>
		
	5、在边界组件中,处理错误判断,如果错误,使用错误处理函数返回相应内容

  方式二:使用第三方库
  	cnpm install -D react-error-boundary
	
	import {ErrorBoundary} from 'react-error-boundary'
      <ErrorBoundary
        FallbackComponent={组件名}  错误时渲染的组件,组件接收两个参数字{error,resetErrorBoundary}
        onReset={() => setExplode(false)}		调用resetErrorBoundary后,修正错误时调用的函数
        resetKeys={[explode]}		可选,当错误发生的组件状态,当状态改变后,会重新渲染
      >
        {explode ? <Bomb /> : null}
      </ErrorBoundary>

代码示例: