Blazor button on click event handeling not working

I have a strange problem in my blazor sample.When i click a button in my component nothing happes... i have no clue why and hope someone can help me.

LoginView.razor

@page "/loginMvvm";@using ProjectPlanningFramework.Parts.Login@rendermode InteractiveServer<h1>LoginView</h1><LoginComponent  /><button @onclick="ShowAlert" class="btn btn-primary">Click Me</button>@code {   [Inject] IJSRuntime JS { get; set; } = default!;   private async Task ShowAlert()   {     await JS.InvokeVoidAsync("alert", "Hello from Blazor!");   }}

In this file we have a btn that show a alert box when clicking. this works.

But the button in the LoginComponent dot not seem to work...

LoginComponent.razor

@using Microsoft.JSInterop<h1>Component Login</h1><button @onclick="ShowAlert" class="btn btn-primary">btn Alert</button>@code {  [Inject] IJSRuntime JS { get; set; } = default!;  private async Task ShowAlert()  {    await JS.InvokeVoidAsync("alert", "Hello from Blazor!");  }}

It's in the loginComponent that it do's not work :(.

Really hope someone can help me!