Blazor linter problem when inheriting a component

Question

i have a simple component called BaseGrid.razor

and then I have another component called CustomGrid.razor

@inherits BaseGrid

...

@{
    base.BuildRenderTree(__builder);
}

...

when using Rider __builder gets marked in red saying

cannot resolve symbol '__builder'

but the project builds just fine

this problem also occur when using ReSharper with Visual Studio

i don't know if its a ReShaper problem or Visual Studio does this too but seeing all the files underlined in red is giving me an headache when trying to find with files have a real problem

I have had similar issues of late with visual studio and Razor components. I don't think Visual Studio, Razor, the compiler, and whatever other processes are involved are on the same page at the moment. — MrC aka Shaun Curtis, Feb 23 '22 at 09:04

score 4 · Accepted Answer · answered Feb 23 '22 at 11:10

In your case the problem is that the Razor compiler manages to interpret what you've coded and by chance work. In the code view Visual Studio has no idea that __builder exists: it only exists in the C# class the Razor compiler builds from the Razor file.

Here's my version of what you've shown us that is "more" syntactically correct (not sure that's the right expression but its the best I can think of now). It doesn't throw errors because Visual Studio understands the concept of a RenderFragment.

BaseGrid

<h3>BaseGrid</h3>

@code {
}

Grid

I assign to base BuildRenderTree method to a RenderFragment delegate and then set the component to render the render fragment.

@inherits BaseGrid
<h3>Grid</h3>

@baseRenderFragment

@code {
    RenderFragment? baseRenderFragment;

    protected override void OnInitialized()
    {
        baseRenderFragment = base.BuildRenderTree;
    }
}

Which then looks like this:

Blazor linter problem when inheriting a component

1 Answers1

BaseGrid

Grid