如何根据用户是否登录来启用/禁用元素?

Question

在目前为止的所有示例中，我都看到了如何显示完全不同的视图的示例——一个用于用户登录时的情况，另一个用于用户未登录时的情况。

我想显示相同的元素，只是启用/禁用一些取决于用户是否登录。我想我可以阅读context.User.Identity.IsAuthenticated并像这样使用它:

<NavLink class="nav-link" href="foobar" 
IsDisabled="@(!(context.User.Identity?.IsAuthenticated ?? false))">
...
</NavLink>

但这需要context。这个属性是由AuthorizeView提供的，这个组件反过来在两组视图之间强制执行前面提到的严格分割。

那么如何实现仅启用/禁用单个公共视图?

我很清楚这不是任何一种安全措施。

这两种答案的效果都是一样的(再次感谢您)，但是有一点需要注意——就在登录之后，这两种方法仍然返回信息:user is not authenticated。接下来的问题是:如何获取用户是否登录的最新信息?

Answer 1

可以通过定义Task<AuthenticationState>类型的级联参数获取鉴权状态数据

以下是来自文档的完整示例:

@page "/"
<button @onclick="LogUsername">Log username</button>
<p>@_authMessage</p>
@code {
[CascadingParameter]
private Task<AuthenticationState> authenticationStateTask { get; set; }
private string _authMessage;
private async Task LogUsername()
{
var authState = await authenticationStateTask;
var user = authState.User;
if (user.Identity.IsAuthenticated)
{
_authMessage = $"{user.Identity.Name} is authenticated.";
}
else
{
_authMessage = "The user is NOT authenticated.";
}
}
}

注意:CascadingAuthenticationState组件是向相关方公开身份验证状态的组件…

Answer 2

您应该能够使用AuthenticationStateProvider。在官方文档中有一个如何做的例子。