Mudblazor Razor page is loading more than one time

Question

I am working on Blazor Web Assembly using Mudblazor. OnInitializedAsync method is being called only one time, but why razor page is rendered two times. Second question is value of message variable is displayed in MudTextField after 2nd iteration of razor page. I have used OnKeyPressed event, and I see that after each key pressed, razor page is rendered again. I will be thankful for suggestion of these issues

@page "/Test"
@using System.ComponentModel.DataAnnotations;
<h1> @message </h1>
<MudTextField Required="true"
              OnKeyPress="OnKeyPressed"
              Immediate="true"
              Margin="Margin.Dense"
              T="Int64"
@bind-Value="@Barcode"
              Label=""
              Variant="Variant.Outlined"
              Adornment="Adornment.Start"
              AdornmentIcon="@Icons.Material.Filled.Person">
</MudTextField>
@if (Barcode > 0)
{
    <MudTextField Label="message" @bind-Value="@message" Variant="Variant.Outlined"></MudTextField>
}
@code {
    public Int64 Barcode { get; set; }
    string message;
    protected override async Task OnInitializedAsync()
    {
        message = "Hello";
        Barcode = 0;
    }

    public async void OnKeyPressed(KeyboardEventArgs e)
    {
        if (e.Key == "Enter")
        {
            await Task.Delay(TimeSpan.FromSeconds(4));
            message = "Hello again";
        }
    }
}

I am using Delay method, to change text value of MudTextField afte 4 seconds.

There are some helpful links for Blazor server applications but couldn't find for Blazor web assembly applications.

Answer 1

I have created identical razor page and seperate out the code behind logic in seperate class. On Enter key pressed event, I call alternate razor component. I don't know it's a better solution, but for me it is ok. If someone else find other solution, I will appreciate.