Skip to content

ibrahim-13/react-catch

Repository files navigation

react-catcher

React component for wrapping Error Boundary

NPM npm bundle size npm bundle size npm type definitions GitHub JavaScript Style Guide

Description

React Catcher provides a component wrapper to catch error during render and prevent White Screen. This component provides the following advantages:

  • Has a default Fallback to show if error occured.
  • User preferred Fallback Component Object can be passed to the component as props.
  • An error hander callback can be passed to the props to call, when an error is caught.

Install

npm install --save react-catcher

Usage

Wrap <App /> or other component to catch any error occured inside it

Parameters:

fallback : JSX.Element - Must be a component/object, can not be a function
errorHandler : (error: Error, errorInfo: React.ErrorInfo) => void - A callback to handle error

import React from 'react'
import ReactDOM from 'react-dom';
import App from './App';
import ReactCatcher from 'react-catcher';

ReactDOM.render((
  <ReactCatcher
    fallback={
      <h1>
        An Error has occured !!
      </h1>
    }
  >
    <App />
  </ReactCatcher>
), document.getElementById('root'))

License

Apache-2.0 © ibrahim-13

Additional Credits

This library was build based on the skeleton generated by Create-React-Library

About

Error Boundary Component for React

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published