Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

@RenderSection Equivalent in Blazor?

Razor pages have a mechanism where you can reference named sections in your layout, and then specify them in your pages that use that layout. For example, if your Layout (_Layout.cshtml) looks like this:

@using...
...
<!DOCTYPE html>
...
<body>
...
@RenderSection("modals", required: false)
...

and then in your dashboard page, for example, you'd have:

<div>
...
</div>
...
...
@section modals
{
    <div class="modal-container>...</div>
    <div class="modal-container>...</div>
}

that would inject the contents of @section modals... into the place in the layout where @RenderSection("modals") is.

How can this be done in Blazor?

like image 365
jbyrd Avatar asked Sep 12 '19 18:09

jbyrd


People also ask

Can we use Cshtml in Blazor?

Well, yes you can. In earlier previews of Blazor, razor components used cshtml files, but this was replaced by razor files. There is an MSBuild property setting that enables you to use cshtml files, but it is purely intended for backward compatibility.

What is RenderFragment in Blazor?

RenderFragment is used to render components or content at run time in Blazor. The RenderFragment class allows you to create the required content or component in a dynamic manner at runtime.

Can you mix Blazor and Razor?

Razor components can be integrated into Razor Pages and MVC apps in a hosted Blazor WebAssembly solution. When the page or view is rendered, components can be prerendered at the same time.


Video Answer


2 Answers

Unfortunately, no such feature is currently supported in Blazor. Blazor team and the community have been discussing the necessity of this feature over a year now, but for no avail. Read here about Sections in Blazor.

However, if you're looking for a 'temporary solution', you may read a comment by SteveAndeson about how to pass parameter values from a Blazor component page to its layout. I know that you're looking for a way to render the @Body plus @EndBody, but the principal remain the same: You have to create a layout component instead of the default layout

Hope this helps...

like image 99
enet Avatar answered Sep 20 '22 19:09

enet


I have created a component to get something similar to sections:

https://github.com/inspgadget/BlazorSections

like image 25
user1519979 Avatar answered Sep 20 '22 19:09

user1519979