diff --git a/aspnetcore/blazor/components/render-modes.md b/aspnetcore/blazor/components/render-modes.md index 969657480544..d5eafe866b4b 100644 --- a/aspnetcore/blazor/components/render-modes.md +++ b/aspnetcore/blazor/components/render-modes.md @@ -178,6 +178,45 @@ To enable global interactivity when creating a Blazor Web App: For more information, see . +## Apply a render mode programatically + +Properties and fields can assign a render mode to a component or a group of components via inheritance. + +### By component definition + +A component definition can define a render mode via a private field: + +```razor +@rendermode componentRenderMode + +... + +@code { + private static IComponentRenderMode componentRenderMode = + new InteractiveServerRenderMode(); +} +``` + +### By component instance + + is available in statically-rendered root components, such as the `App` component (`App.razor`). You can use [`HttpContext.Request.Path`](xref:Microsoft.AspNetCore.Http.HttpContext.Request%2A) to specify a render mode for a group of pages. + +The following example applies interactive server-side rendering (interactive SSR) to any request for a component in the app's `Admin` folder (`Components/Admin`), including subfolders. Components at any other path don't receive a render mode (`null`) from the `Routes` component, and they either render statically, inherit a render mode from a parent component, or set their own render mode. + +```razor + + +... + +[CascadingParameter] +private HttpContext HttpContext { get; set; } = default!; + +private IComponentRenderMode? RenderModeForPage => + HttpContext.Request.Path.StartsWithSegments("/Admin") ? InteractiveServer : null; +``` + +Additional information on render mode propagation is provided in the [Render mode propagation](#render-mode-propagation) section later in this article. + ## Prerendering *Prerendering* is the process of initially rendering page content on the server without enabling event handlers for rendered controls. The server outputs the HTML UI of the page as soon as possible in response to the initial request, which makes the app feel more responsive to users. Prerendering can also improve [Search Engine Optimization (SEO)](https://developer.mozilla.org/docs/Glossary/SEO) by rendering content for the initial HTTP response that search engines use to calculate page rank.