Can't use the <component /> tag helper on a Razor Page?

Question

I'm using DotNetCore 3.1 and Razor Pages.

I want to use a Razor Component I created on the Index.Razor page, but have it use the 'Static' rendering mode.

According to the documentation:

To render a component from a page or view, use the Component Tag Helper:

<component type="typeof(Counter)" render-mode="ServerPrerendered" 
    param-IncrementAmount="10" />

As you can see below, I can render my component (named Lister) using it's name as a tag (<Lister></Lister>). I am unable, however, to use the <component /> tag helper to render it.

It neither highlights the syntax as a recognized tag helper nor actually renders it if I run the page.

When I do run the page, it does not show the component, it instead appears as

<component type="typeof(Lister)" render-mode="Static"></component>

in the page source.

In another project, I was able to render the same component (with the same syntax) in an MVC View (.cshtml) file.

---

Edit:

Ok, so I think what I missed/messed up is that my Index.razor file is not a Razor Page, but rather a routable Razor Component.

I mistakenly took a Blazor project to be a Razor Pages one.

Razor Pages have .cshtml file types

Razor Components have .razor file types (and can confusingly have the @page directive)

Razor Components have no access to the <component /> tag helper, and must use other Razor Components via <theNameOfIt></theNameOfIt>

Thanks for the help!

Answer 1

The component Tag Helper is not a Blazor object. The concept of tag helper or html helper in Blazor does not exist. This is the domain of Razor Pages and MVC. In Blazor we have a Component Model.

Ordinarily you should use the component Tag Helper within the _Host.cshtml file to render the Razor App component.

You can't embed the component Tag Helper in your Index.razor component. You can't use the component Tag Helper in Blazor. The _Host.cshtml file is not Blazor. It's a Razor Pages file that starts a Blazor application...