Follow

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use
Contact

Blazor: Inherited component with no content displays as empty

I saw many examples of inherited components. They all look like:

Base.razor:
@code{
    //some code here.
}

Inherited.razor:
@inherits Base
<div>
    //some content here
</div>

Now what I’m doing is just on the other side:

Base.razor:
<div>
    //some content here
</div>

Inherited.razor:
@inherits Base

@code{
    //some code here, initializing parameters, override some methods.
}

But if I use

MEDevel.com: Open-source for Healthcare and Education

Collecting and validating open-source software for healthcare, education, enterprise, development, medical imaging, medical records, and digital pathology.

Visit Medevel

<Inherited></Inherited>

to render it, it’s empty. What shall I do then? Any help will be appreciated.

More real code here:

Base(CrudIndex2.razor):

@typeparam TItem where TItem : class, LibInterfaceBase.IIdable, new()

@inject Microsoft.Extensions.Localization.IStringLocalizer<GlobalRes> GlobalLocalizer

@if (!Loaded)
{
    <MudProgressCircular Color="Color.Primary" Indeterminate="true"/>
}
else
{
    <MudTable>...</MudTable>
}

Inherited:

@page "/AdaPPM/MeasureItemDefinitions/Index"
@inherits CrudIndex2<LibAdaMetrics.DataRecords.MeasureItemDefinition>

@code
{
//    int CurrentUser = await _authenticationManager.CurrentUser();
    protected override async Task OnInitializedAsync()
    {
        base.InitBase(
            typeof(CreateOrEditMeasureItemDefinitionDialog),
            AdaHubMeasureItemDefinitions.Instance);

        CurrentUser = await _authenticationManager.CurrentUser();
        CanCreate = (await _authorizationService.AuthorizeAsync(CurrentUser, Permissions.MeasurementBaselines.Create)).Succeeded;
        CanEdit = (await _authorizationService.AuthorizeAsync(CurrentUser, Permissions.MeasurementBaselines.Edit)).Succeeded;
        CanDelete = (await _authorizationService.AuthorizeAsync(CurrentUser, Permissions.MeasurementBaselines.Delete)).Succeeded;

        await ResetAsync();
        Loaded = true;
    }

>Solution :

Your Inherited.razor provides no content, and the content of the base class will not be rendered.

This specific case can be fixed by putting your derived class in a plain cs file:

Inherited.cs

public class Inherited : CrudIndex2
{
  ...
}

But a more common pattern is to turn that around: Base.cs and Inherited.razor

It will work as long as only 1 class is from a .razor file.

Add a comment

Leave a Reply

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use

Discover more from Dev solutions

Subscribe now to keep reading and get access to the full archive.

Continue reading