Blazor基于角色显示内容时AuthorizeView丢失循环上下文如何解决

问题原因 #

默认情况下<AuthorizeView>组件内部的@context变量指向的是AuthenticationState类型的身份验证上下文对象，和你外层循环遍历表格行模型时的上下文变量重名，因此访问@context.DeviceId时会被识别为读取身份验证上下文的属性，自然不存在该属性。

解决方法 #

• 方案1：在外层循环时定义独立的局部变量存储行模型，避免使用重名的上下文变量

@* 示例为表格行循环逻辑，循环时将行项赋值给自定义局部变量device *@
@foreach (var device in DeviceList)
{
    <tr>
        <td>@device.DeviceName</td>
        <td>@device.DeviceSpec</td>
        <td>
            <AuthorizeView Roles="Admin">
                @* 直接引用循环内的device局部变量，不受AuthorizeView上下文影响 *@
                <MudButton OnClick="() => NavManager.NavigateTo($"device/delete/{device.DeviceId}")">
                    删除
                </MudButton>
            </AuthorizeView>
        </td>
    </tr>
}

注：代码中的NavManager为Blazor中注入的NavigationManager服务实例，用于实现页面路由跳转

• 方案2：修改AuthorizeView的上下文别名，避免和外层上下文重名
  如果你外层逻辑需要使用默认的@context作为行模型变量，可以手动给AuthorizeView指定独立的上下文名称，规避重名冲突：

<AuthorizeView Roles="Admin" Context="authContext">
    @* 这里的@context依旧指向外层的行模型，不会和AuthorizeView的上下文冲突 *@
    <MudButton OnClick="() => NavManager.NavigateTo($"device/delete/{@context.DeviceId}")">
        删除
    </MudButton>
</AuthorizeView>

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