Search code examples
c#asp.net-mvcasp.net-corerazorblazor

ASP.NET Core 7 MVC shows the Razor component twice


I used my Razor component in my view and it ended up showing the same component twice.

I don't know why it happens, but once in 2 times, it shows the component normally. I use .NET 7.

enter image description here

Create.razor (used component)

@using CarStock.Data
@using Microsoft.AspNetCore.Components.Forms
@inject NavigationManager NavigationManager
@inject IPostService postS

<EditForm Model="@Post" OnValidSubmit="@CreatePost">
    <DataAnnotationsValidator />

    <div class="form-group">
        <label for="Title">Title</label>
        <InputText id="Title" @bind-Value="Post.Title" class="form-control" />
    </div>
    <div class="form-group">
        <label for="Content">Content</label>
        <InputTextArea id="Content" @bind-Value="Post.Content" class="form-control" />
    </div>
    <button onclick="@CreatePost()" class="btn btn-primary">Create</button>
</EditForm>

@code {
    Post Post = new Post();

    async Task CreatePost()
    {
        // Call service to create post
        await postS.CreatePost(Post);

        NavigationManager.NavigateTo("Blog", true);
        await Task.CompletedTask;
    }
}

Create.cshtml (view page)

@using CarStock.Components.Blog;
@model CarStock.Data.Post

@{
    ViewBag.Title = "Create";
}

<div class="my-3 p-2">
    <component type="typeof(Create)" render-mode="Server" />
</div>

Solution

  • Thanks @Rena for a hint. It was dublicating because I had this line twice in my layout

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

    Funny bug