Blazor WASM: Inheritance Does not Render mark up from Inherited class

Viewed 58

This line of code: "base.BuildRenderTree(__builder);" does not compile.

I'm trying to add a base component that will handle some downloadable data that is needed on every page.

I can pass my dependency injection, and properties through inheritance, but I can't get the mark up from the base component to render. __builder is not exposed, and I can't override BuildRenderTree.

Anyone know what the deal is?

1 Answers

As you haven't provided any code to work with here's some code that demonstrates the various techniques you can use within the standard ComponentBase implementation.

Here's a base component to inherit from:

// MyBasePage.razor
<h3>MyBasePage</h3>

<p>This is content in the base page</p>

<p>@ChildRenderFragment</p>

@code {
    protected RenderFragment Footer(string FooterMessage) => (__builder) =>
        {
            <div class="col-12 bg-primary text-white p-2 text-lg-center">@FooterMessage</div>
        };

    protected virtual RenderFragment ChildRenderFragment => (__builder) =>
    {
        <div>Child Content Goes Here</div>
    };

    protected virtual RenderFragment? BaseContent { get; set; }
}

And an inherited page:

@page "/"
@inherits MyBasePage

@BaseContent

@code {
    protected override RenderFragment BaseContent => (builder) => base.BuildRenderTree(builder);

    protected override RenderFragment ChildRenderFragment => (__builder) =>
    {
        <div class="p-2 m-2 bg-dark text-white">
        This is the child content
        </div>
        @this.Footer("Cold Elm Coders")
    };
}

The code is a little convoluted because ComponentBase is tied down so there's no access to modify the RenderFragment that's submitted to the Renderer.

If you want a more elegant solution you need to write your own ComponentBase. See my answer to this question for one.

Related