0.3.0 • Published 7 years ago
react-resilent v0.3.0
react-resilent
A high order component for resilently render components that might fail. It wraps them around a React Fiber error boundary.
- Tries to render your component
- Returns
<FallbackComponent />
after the maximum number of retries (props.maxRetries
)
⚠️ DISCLAIMER: Experimental
This ONLY works with react@next
(Fiber).
Demo
import React from 'react'
import Resilent from 'react-resilent'
const Broken = () => {
throw new Error('Broken!')
}
const ResilentComponent = Resilent({
FallbackComponent: () => <div>Fallback component</div>
})(Broken)
export default class Application extends React.Component {
onError = (error) => {
console.error('Error catched', error)
}
render () {
return (
<ResilentComponent
maxRetries={2}
onError={this.onError}
/>
)
}
}
API
const MyResilentComponent = Resilent({
FallbackComponent: React.Component
})(React.Component)
<MyResilentComponent
maxRetries={number}
onError={func}
/>
opts.FallbackComponent
React component displayed after the maxRetries
props.maxRetries
(optional, defaults to 0)
Number of retries before showing the FallbackComponent
props.onError
(optional)
Callback for when errors are thrown