Blazor NavigationManager Return“/？”

Question

我正在为我的 Web 项目使用 Blazor。我正在学习这个框架，但我遇到了问题。如果我想转到另一页，我可以这样做：

<a href="DetailsPage" class="btn btn-primary">Details</a>

现在，我创建了一个登录页面（我的索引页面和 URL 是 https://5000) and I check user information. I can't any authorization. If this informations are true, the user goes to homepage, else the user stays login page. But, when I try true information and click login button, I go to homepage (https://5000/homepage) and return the login page (https://5000/?) again. When I return login page, my URL is "https://5000/？”。为什么我 return 我的登录页面看到“？”。

@page "/"
@using MyProject.Data
@using System.Net.Http
@inject HttpClient Http
@inject IMatToaster Toaster
@inject NavigationManager NavigationManager

<form>
    <div class="form-group">
        <label for="UserName">User Name</label>
        <input type="text" class="form-control" placeholder="User Name" @bind="@UserName">
    </div>
    <div class="form-group">
        <label for="UserPassword">User Password</label>
        <input type="password" class="form-control" placeholder="User Password" @bind="@UserPassword">
    </div>
    <button type="submit" class="btn btn-primary" @onclick="@Login">Log In</button>
</form>

@code {

    private User[] UserList;
    private User[] Control;

    public string UserName, UserPassword;

    protected override async Task OnInitializedAsync()
    {
        await getData();
    }

    protected async Task getData()
    {
        UserList = await Http.GetJsonAsync<User[]>("/api/Users/");
    }

    protected void Login()
    {
        if (String.IsNullOrEmpty(UserName) || String.IsNullOrEmpty(UserPassword))
        {
        }
        else
        {
            Control = UserList.Where(A => A.UserName.Equals(UserName, StringComparison.OrdinalIgnoreCase) && A.UserPassword == UserPassword).ToArray();
            if (Control.Length == 0)
            {   
            }
            else
            {
                NavigationManager.NavigateTo("/homepage");
            }
        }
    }
}

Answer 1

这是因为你使用了<button type="submit"></button> 在一个表单元素中。当您单击该按钮时，将执行传统的 post 返回操作，并且浏览器会尝试将表单数据 post 发送到服务器。当然，这不是你的本意。您只想在 SPA 应用程序的 space 内导航，对吗？

要解决此问题，请将类型属性设置为 "button"，如下所示：

<button type="button"></button>

希望这对您有所帮助...

Blazor NavigationManager Return“/？”

Blazor NavigationManager Return "/?"

navigation

asp.net-core

blazor

blazor-server-side