You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: aspnetcore/blazor/fundamentals/handle-errors.md
+29-17Lines changed: 29 additions & 17 deletions
Original file line number
Diff line number
Diff line change
@@ -341,7 +341,15 @@ For global exception handling, see the following sections:
341
341
* Renders its child content when an error hasn't occurred.
342
342
* Renders error UI when an unhandled exception is thrown.
343
343
344
-
To define an error boundary, use the <xref:Microsoft.AspNetCore.Components.Web.ErrorBoundary> component to wrap existing content. For example, an error boundary can be added around the body content of the app's main layout.
344
+
To define an error boundary, use the <xref:Microsoft.AspNetCore.Components.Web.ErrorBoundary> component to wrap existing content. The app continues to function normally, but the error boundary handles unhandled exceptions.
345
+
346
+
```razor
347
+
<ErrorBoundary>
348
+
...
349
+
</ErrorBoundary>
350
+
```
351
+
352
+
To implement an error boundary in a global fashion, add the boundary around the body content of the app's main layout.
345
353
346
354
In `MainLayout.razor`:
347
355
@@ -353,7 +361,26 @@ In `MainLayout.razor`:
353
361
</article>
354
362
```
355
363
356
-
The app continues to function normally, but the error boundary handles unhandled exceptions.
364
+
:::moniker-end
365
+
366
+
:::moniker range=">= aspnetcore-8.0"
367
+
368
+
<!-- UPDATE 8.0 Cross-link SSR -->
369
+
370
+
In Blazor Web Apps with the error boundary only applied to a noninteractive `MainLayout` component, the boundary is only active during the server-side static rendering phase. The boundary doesn't activate just because a component further down the component hierarchy is interactive. To enable interactivity broadly for the `MainLayout` component and the rest of the components further down the component hierarchy, enable server-side rendering (SSR) at the top of the `Routes` component (`Components/Routes.razor`):
371
+
372
+
```razor
373
+
@attribute [RenderModeServer]
374
+
```
375
+
376
+
If you prefer not to enable server interactivity across the entire app from the `Routes` component, place the error boundary further down the component hierarchy. For example, place the error boundary around markup in individual components that enable interactivity, not in the app's main layout. The important concepts to keep in mind are that wherever the error boundary is placed:
377
+
378
+
* If the error boundary isn't interactive, it's only capable of activating on the server during static rendering. For example, the boundary can activate when an error is thrown in a component lifecycle method.
379
+
* If the error boundary is interactive, it's capable of activating for both server-side rendering and for interactive components that it wraps.
380
+
381
+
:::moniker-end
382
+
383
+
:::moniker range=">= aspnetcore-6.0"
357
384
358
385
Consider the following example, where the `Counter` component throws an exception if the count increments past five.
359
386
@@ -429,24 +456,9 @@ An alternative to using [Error boundaries](#error-boundaries) (<xref:Microsoft.A
429
456
430
457
The following `Error` component example merely logs errors, but methods of the component can process errors in any way required by the app, including through the use of multiple error processing methods.
0 commit comments