首页 > 解决方案 > 按下按钮时,Blazor 服务器应用程序中的输入字段未绑定

问题描述

我在我的应用程序中遇到了奇怪的行为,当我在我的 PC 上调试它时,它运行良好,当我将它发布到 Azure 时,当我按下“登录”按钮时密码输入没有绑定。要绑定它,我必须单击其他地方,然后按“登录”按钮。这是我的代码:

<AuthorizeView>
<Authorized>
    <b>Hello, @context.User.Identity.Name!</b>
    <a class="ml-md-auto btn btn-primary"
       href="/logout?returnUrl=/"
       target="_top">Logout</a>
</Authorized>
<NotAuthorized>
    <input type="text"
           placeholder="User Name"
           @bind="@Username" />
    &nbsp;&nbsp;
    <input type="password"
           placeholder="Password"
           @bind="@Password" />
    <a class="ml-md-auto btn btn-primary"
       href="/login?paramUsername=@encode(@Username)&paramPassword=@encode(@Password)"
       target="_top">Login</a>
@code {
     string Username = "";
     string Password = "";
     private string encode(string param)
     {
         return HttpUtility.UrlEncode(param);
     }
}

标签: c#asp.netblazor

解决方案


发生这种情况是因为该值仅在您关注输入时才设置,您应该使用一种在每次按键时更新该值的方法。

<input 
    type="password"
    placeholder="Password"
    @bind="@Password" 
    @bind:event="oninput" // update value on every key press
/>

推荐阅读