Blazor页面点击按钮切换标签内容无响应问题排查求助

我是刚接触Blazor和C#的实习生，最近遇到了个头疼的问题：在我的Blazor首页里，点击三个按钮（自定义But组件、MudBlazor原生按钮）时，页面内容区域没法像切换标签一样更新，完全没反应。我试了原生MudButton也没用，怀疑是不是点击事件没被检测到，或者Visual Studio的热重载出问题了？下面是我的页面代码和自定义按钮组件代码，麻烦帮忙看看哪里出问题了，谢谢！

页面代码 (Index.razor) #

@page "/"
@using Basil.Components.Buttons
@using MudBlazor

<PageTitle>Project choice</PageTitle>

@* 注释掉的测试代码 *@
@* <MudButtonGroup Exclusive="true" Color="Color.Primary" Variant="Variant.Filled">
    <But Icon=@Icons.Material.Filled.Shortcut OnClick="@(() => SelectTab("raccourci"))" />
    <But Icon=@Icons.Material.Filled.Train OnClick="@(() => SelectTab("projects"))" />
    <But Icon=@Icons.Material.Filled.Factory OnClick="@(() => SelectTab("site"))" />
</MudButtonGroup> *@

<MudButtonGroup Exclusive="true" Color="Color.Primary" Variant="Variant.Filled">
    <MudButton OnClick="@SelectTabProjects">Test Projet</MudButton>
    <But Icon=@Icons.Material.Filled.Shortcut OnClick=@SelectTabRaccourci />
    <But Icon=@Icons.Material.Filled.Train OnClick=@SelectTabProjects />
    <But Icon=@Icons.Material.Filled.Factory OnClick=@SelectTabSite />
</MudButtonGroup>

<div class="mt-4">
    @if (selectedTab == "raccourci")
    {
        <h2>Contenu Raccourci</h2>
    }
    else if (selectedTab == "projects")
    {
        <h2>Contenu Projets</h2>
    }
    else if (selectedTab == "site")
    {
        <h2>Contenu Site</h2>
    }
</div>

@code {
    private string selectedTab = "raccourci";

    private void SelectTabRaccourci()
    {
        selectedTab = "raccourci";
        StateHasChanged();
    }

    private void SelectTabProjects()
    {
        selectedTab = "projects";
        StateHasChanged();
    }

    private void SelectTabSite()
    {
        selectedTab = "site";
        StateHasChanged();
    }
}

自定义按钮组件 (But.razor) #

@using MudBlazor;

@if (IsVisible)
{
    <div class="@CssAlign" style="padding-left:5px;padding-right:5px;">
        <MudTooltip Placement=Placement.Top Color=@TooltipColor Arrow=true>
            <ChildContent>
                @if (MudBadgeContent > 0)
                {
                    <MudBadge Content=@MudBadgeContent Overlap=true Bordered=true Color=@Color.Secondary>
                        <MudIconButton Color=@Color Variant=Variant.Filled Size=Size.Small Icon=@Icon OnClick=@Clic Disabled=@(PadLock || Disabled)>@Title</MudIconButton>
                    </MudBadge>
                }
                else
                {
                    <MudIconButton Color=@Color Variant=Variant.Filled Size=Size.Small Icon=@Icon OnClick=@Clic Disabled=@(PadLock || Disabled)>@Title</MudIconButton>
                }
            </ChildContent>
            <TooltipContent>
                @((MarkupString)TooltipContent)
            </TooltipContent>
        </MudTooltip>
    </div>
}

@code {
    [Parameter]
    public EventCallback OnClick { get; set; }

    [Parameter]
    public string TooltipContent { get; set; }

    [Parameter]
    public string Title { get; set; }

    [Parameter]
    public string Icon { get; set; }

    [Parameter]
    public bool AlignRight { get; set; } = false;

    [Parameter]
    public bool DisableAlign { get; set; } = false;

    [Parameter]
    public bool Disabled { get; set; } = false;

    [Parameter]
    public bool IsVisible { get; set; } = true;

    [Parameter]
    public int MudBadgeContent { get; set; } = 0;

    [Parameter]
    public Color Color { get; set; } = Color.Primary;

    [Parameter]
    public Color TooltipColor { get; set; } = Color.Default;

    private bool PadLock { get; set; }

    private string CssAlign => DisableAlign ? "inline" : AlignRight ? "right" : "left";

    private async Task Clic()
    {
        PadLock = true;
        StateHasChanged();
        if (OnClick.HasDelegate)
        {
            await OnClick.InvokeAsync();
        }
        PadLock = false;
        StateHasChanged();
    }
}

我已经尝试过的操作 #

• 替换成原生MudButton直接绑定方法，还是没反应
• 在切换方法里手动调用StateHasChanged()，依然无效
• 怀疑过热重载问题，但重启Visual Studio后还是一样

请问各位大佬，可能是什么原因导致点击事件没触发或者页面不更新？如果需要更多信息我可以补充！

内容来源于stack exchange