what is the right way to render blazor component?

Question

I don't understand what's the right way to render Blazor Components.

I have installed razor server in a C# ASP NET Core web application. I'm trying to render components using render-mode="ServerPrerendered" or render-mode="Server"

In both case I need to declare the script _framework/blazor.server.js

If I declare the script on the main _Layout.cshtml where all other scripts are or at the end of the body tag, component is dead: events and functions do not work, there is no way to change the component dynamically; I can see on the console that the connection is established as soon as the web app starts. So when i navigate to the page where I have my component, it's too late.
If I declare the script just after my component, instead, all works. The component renders fine, events and functions work fine.

So for now I'm using 2. BUT in this way, each time I need to use a component on a new page, I declare again and again the script, so the connection is destroyed and established each time.

I don't think this is the clean solution. What is the right way to render components, then?

Thanks you in advance and sorry for bad english

Markus Dresch Markus Dresch · Accepted Answer · 2020-12-01T16:01:54

Judging from the "BlazorApp" template provided by the latest version of Visual Studio, you put it at the end of Pages/_Hosts.cshtml:

<body>
    <component type="typeof(App)" render-mode="ServerPrerendered" />

    <div id="blazor-error-ui">
        <environment include="Staging,Production">
            An error has occurred. This application may no longer respond until reloaded.
        </environment>
        <environment include="Development">
            An unhandled exception has occurred. See browser dev tools for details.
        </environment>
        <a href="" class="reload">Reload</a>
        <a class="dismiss">🗙</a>
    </div>

    <script src="_framework/blazor.server.js"></script>
</body>

what is the right way to render blazor component?

1 Answers