Blazor non-base class inheritance

Question

Consider a simple blazor component MyText

<p>@Title</p>

public partial class MyText
{
    [Parameter] public string Title { get; set; }
}

In page I use it as: <MyText Title="Abc" />

Now I would like to extend this component but do not want to change it, rather derive it by a new component MyTextEx and add another parameter. Something like:

@inherits MyText

<!-- Show base component something like: --!>
@base

<p>@Message</p>

public partial class MyTextEx
{
    [Parameter] public string Message { get; set; }
}

What I could not find how to display the base component's content? So it is rendered as:

<p>@Title</p>
<p>@Message</p>

Note this is a simplified example and my base component has a lot of parameters, events and hoping for virtual methods which could be overridden by extended/derived component. I'm trying to avoid composition like approach in razor file for base component because AFAIK I have to again populate it with parameters:

@inherits MyText

<MyText Title="@Title" />

<p>@Message</p>

I was able to find inheritance examples with base/abstract components, but could not find inheritance with final components.

Any idea how to achieve this?

Thanks, Csaba

Answer 1

@inherits MyText

<!-- Show base component like: --!>
@RenderBase()

<p>@Message</p>

@code 
{    
    // Message etc ...

    RenderFragment RenderBase() => builder => base.BuildRenderTree(builder);    
}

Answer 2

A more direct alternative to the accepted answer:

@inherits MyText

<!-- Show base component something like: --!>
@{ base.BuildRenderTree(__builder); }

<p>@Message</p>

public partial class MyTextEx
{
    [Parameter] public string Message { get; set; }
}