A helper for React Native to catch global JS errors and provide some ways to resolve error boundaries.
yarn add react-native-error-helper
import { setGlobalErrorHandler } from 'react-native-error-helper';
setGlobalErrorHandler((error, isFatal) => {
console.log('global error:', error, isFatal);
}, true);
import { setPromiseUnCatchHandler } from 'react-native-error-helper';
setPromiseUnCatchHandler((id, err) => {
console.log('promise un catch:', err);
}, true);
import { ErrorBoundary } from 'react-native-error-helper';
const App = () => (
<ErrorBoundary>
<BugComponent />
</ErrorBoundary>
)
import { withErrorBoundary } from 'react-native-error-helper';
@withErrorBoundary({
renderBoundary: ({error}) => {
return <Text>catch error: {error.message}</Text>;
},
})
class BugCenter extends React.Component {
constructor(props) {
super(props);
this.state = {
isError: false,
};
}
render() {
const {isError} = this.state;
if (isError) {
throw new Error('💥');
} else {
return (
<Text
onPress={() => {
this.setState({
isError: true
});
}}>
{String(isError)}
</Text>
);
}
}
}
import { withErrorBoundary } from 'react-native-error-helper';
const BugCenter = props => {
const [isError, setIsError] = useState();
if (isError) {
throw new Error('💥');
} else {
return (
<Text
onPress={() => {
this.setState({
isError: true
});
}}>
{String(isError)}
</Text>
)
}
}
const SafeCenter = withErrorBoundary({
renderBoundary: ({error}) => {
return <Text>catch error: {error.message}</Text>;
},
})(BugCenter);
MIT