Blazor中如何将<MudNavLink>用作带<AntiforgeryToken>的POST <form>

我有一个包含多个<MudNavLink>的<MudNavMenu>，想要在导航菜单里添加一个注销按钮，功能要和下面带<AntiforgeryToken>的<form>完全一致：

原

代码示例：

<Authorized>
    <form action="authentication/logout" method="post">
        <AntiforgeryToken />
        <input type="hidden" name="ReturnUrl" value="@currentUrl" />
        <button type="submit" class="nav-link">
            <span class="bi bi-arrow-bar-left-nav-menu" aria-hidden="true"></span> Logout @context.User.Identity?.Name
        </button>
    </form>
</Authorized>

我试过把<MudNavLink>嵌套在submit类型的<MudButton>里，但样式效果很差，请问怎么实现和上述表单功能一致的注销导航项？

现有代码：

<Authorized>
    <MudNavLink Href="authentication/logout" Match="NavLinkMatch.Prefix" Icon="@Icons.Material.Filled.Logout">Logout</MudNavLink>
</Authorized>

注意：<MudNavLink>本质是生成<a>标签，默认发起GET请求，但注销接口通常要求POST请求（配合防伪令牌），所以不能直接用<MudNavLink>的原生跳转逻辑，需要把表单提交逻辑和MudNav的样式结合，以下是两种可行方案：

方案1：用表单包裹MudButton，模拟MudNavLink样式 #

把原表单里的按钮替换为<MudButton>，通过属性配置让它和其他<MudNavLink>样式完全统一：

<Authorized>
    <form action="authentication/logout" method="post" class="d-block m-0">
        <AntiforgeryToken />
        <input type="hidden" name="ReturnUrl" value="@currentUrl" />
        <MudButton 
            Type="submit" 
            Variant="Text" 
            Class="mud-nav-link mud-nav-item" 
            Icon="@Icons.Material.Filled.Logout"
            FullWidth="true">
            Logout @context.User.Identity?.Name
        </MudButton>
    </form>
</Authorized>

• Variant="Text"让按钮无背景，贴合导航链接的风格
• Class="mud-nav-link mud-nav-item"直接复用MudNavLink的内置样式类
• FullWidth="true"确保按钮和其他导航项宽度一致

方案2：给MudNavLink绑定点击事件，手动提交表单 #

如果一定要保留<MudNavLink>的结构，可以隐藏表单，通过<MudNavLink>的点击事件触发表单提交：

<Authorized>
    <!-- 隐藏的注销表单 -->
    <form id="logoutForm" action="authentication/logout" method="post" class="d-none">
        <AntiforgeryToken />
        <input type="hidden" name="ReturnUrl" value="@currentUrl" />
    </form>

    <!-- 正常的MudNavLink，点击时提交表单 -->
    <MudNavLink 
        @onclick="() => document.getElementById('logoutForm').submit()"
        Match="NavLinkMatch.Prefix" 
        Icon="@Icons.Material.Filled.Logout">
        Logout @context.User.Identity?.Name
    </MudNavLink>
</Authorized>

这种方式既保留了<MudNavLink>的原生样式，又能触发符合要求的POST注销请求，同时传递防伪令牌和ReturnUrl参数。

内容的提问来源于stack exchange，提问作者Shuzheng