- Render
ErrorBoundaryContext
around fallback UI as well, so theuseErrorBoundary
hook could be used within the fallback component to reset the boundary.
For example:
import { useErrorBoundary } from "react-error-boundary";
function ErrorFallback({ error }) {
const { resetBoundary } = useErrorBoundary();
return (
<div role="alert">
<p>Something went wrong:</p>
<pre style={{ color: "red" }}>{error.message}</pre>
<button onClick={resetBoundary}>Try again</button>
</div>
);
}
See this demo: https://codesandbox.io/s/nostalgic-browser-e9lpmf