0 Tage Serie
javascript / intermediate
Snippet

Globale Fehlerbehandlung in Next.js

Die Datei error.tsx fängt automatisch Fehler in ihrem Segment ab und ermöglicht es Benutzern, sich zu erholen, indem der Komponentenbaum mit der reset-Funktion neu gerendert wird.

snippet.js
javascript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
'use client';
export default function Error({
error,
reset,
}: {
error: Error & { digest?: string };
reset: () => void;
}) {
return (
<div>
<h2>Something went wrong!</h2>
<button onClick={() => reset()}>Try again</button>
</div>
);
}
nextjs
Erklärung
1
'use client';
Error Boundaries müssen Client-Komponenten sein.
2
reset: () => void
Eine Funktion, die versucht, das Segment neu zu rendern, um den Fehler zu beheben.