How to use sections properly in a layout hierarchy in ASP.NET Core MVC Razor pages?

Question

I have a multi-level hierarchical layout inheritance:

Layout.cshtml

MaterialLayout.cshtml // inherits Layout.cshtml

UserPanelLayout.cshtml // inherits MaterialLayout.cshtml

Index.cshtml // inherits UserPanelLayout.cshtml

I have defined a section in Layout.cshtml say @RenderSection("Loader", false), and I want to define that section in UserPanelLayout.cshml.

But I get this error:

The following sections have been defined but have not been rendered by the page at '/Views/Shared/MaterialLayout.cshtml': 'Loader'. To ignore an unrendered section call IgnoreSection("sectionName").

What is the proper way to use sections in a multi-level hierarchical layout inheritance?

Answer 1

To achieve this you need define the section in MaterialLayout.cshtml like this:

@section Loader
{
    @RenderSection("Loader", false)
}