Question

我正在使用ASP.NET Core Blazor服务器端，.NET 5版本5.0.100-preview.8.20417.9，Microsoft SQLServer 2019数据库，ASP.NET Core身份，Microsoft Visual Studio Community 2019预览-版本16.8.0预览2.1。我要在没有用户登录时显示登录链接。用户登录成功后，显示web-app。我的代码在下面。

文件MainLayout.razor

@inherits LayoutComponentBase
@implements IDisposable

@inject Microsoft.AspNetCore.Components.NavigationManager NavigationManager
@inject IJSRuntime JSRuntime

@using Microsoft.JSInterop;
<AuthorizeView>
    <Authorized>


<div class="sidebar">
    <div class="top-row logo-container pl-4 navbar-dark bg-light text-body">
        <button class="navbar-toggler" @onclick="@ToggleNavMenu">
            <span class="navbar-toggler-icon"></span>
        </button>
        <span class="logo-image" />
        @*<div class="@($"bg-light text-dark d-inline-block theme-settings { ThemeSwitcherShown }")">
                <a class="nav-item nav-link" @onclick="@ToggleThemeSwitcherPanel" href="javascript:void(0);">
                    <span class="demo-theme-icon"></span>
                </a>
            </div>*@
    </div>
    <div class="@NavMenuCssClass">
        <NavMenu />
    </div>
</div>

<div class="main">
    <div class="top-row bg-light text-body px-4" id="navbar">
        <div class="logo">
            <h5 class="caption">Foo</h5>
        </div>
        <div class="@($"theme-settings { ThemeSwitcherShown }")">
            <a class="nav-item nav-link" @onclick="@ToggleThemeSwitcherPanel" href="javascript:void(0);">
                <span class="demo-theme-icon"></span>
            </a>
        </div>
    </div>
    <div class="content px-4">
        @Body
    </div>
</div>


<ThemeSwitcher @bind-Shown="@ThemeSwitcherShown"></ThemeSwitcher>
    </Authorized>
</AuthorizeView>

@if(!HttpContext.User.Identity.IsAuthenticated) 
{
    <a href="/Identity/Account/Login">Log in</a>
}


@code {
    string NavMenuCssClass { get; set; } = "";

    void ToggleNavMenu()
    {
        NavMenuCssClass = string.IsNullOrEmpty(NavMenuCssClass) || NavMenuCssClass.Contains("d-none") ? "d-block d-xl-none" : "d-none d-xl-flex";
        ThemeSwitcherShown = false;
    }

    bool themeSwitcherShown = false;
    bool ThemeSwitcherShown
    {
        get => themeSwitcherShown;
        set
        {
            themeSwitcherShown = value;
            InvokeAsync(StateHasChanged);
        }
    }

    void ToggleThemeSwitcherPanel()
    {
        ThemeSwitcherShown = !ThemeSwitcherShown;
    }

    string UriFragment { get; set; } = "";

    void OnLocationChanged(object sender, LocationChangedEventArgs args)
    {
        if (!string.IsNullOrEmpty(NavMenuCssClass))
        {
            NavMenuCssClass = "";
            InvokeAsync(StateHasChanged);
        }
    }

    protected override void OnInitialized()
    {
        base.OnInitialized();
        NavigationManager.LocationChanged += OnLocationChanged;
    }

    protected override Task OnAfterRenderAsync(bool firstRender)
    {
        if (firstRender)
        {
            JSRuntime.InvokeAsync<string>("ScrollToTarget");
        }
        return base.OnAfterRenderAsync(firstRender);
    }

    void IDisposable.Dispose()
    {
        NavigationManager.LocationChanged -= OnLocationChanged;
    }
}

我的想法集中在这些方面

<AuthorizeView>
    <Authorized>
        <!-- Show when user log in. -->
    </Authorized>
</AuthorizeView>
    
@if(!HttpContext.User.Identity.IsAuthenticated) 
{
    <a href="/Identity/Account/Login">Đăng nhập</a>
}

但出现错误

@if(!HttpContext.User.Identity.IsAuthenticated)

（帮助我修复此部分）

错误

用户未登录时如何显示登录链接？

Answer 1

这在模板的LoginDisplay.razor中得到了展示。

    <AuthorizeView>
        <Authorized>
             <!-- Show when user log in. -->
        </Authorized>
        <NotAuthorized>
             <a href="/Identity/Account/Login">Đăng nhập</a>
        </NotAuthorized>
    </AuthorizeView>

用户未登录时如何显示登录链接？

1 个答案: