如何通过代码更改EditForm中的值？

Question

这是 html：

 <EditForm Model="Input" method="post" OnValidSubmit="LoginUser" FormName="login" Enhance>
     <DataAnnotationsValidator />
     <div id="SubmitDiv">
         <InputText @bind-Value="Input.Email" class="ant-input SubmitContentInput" autocomplete="username" aria-required="true" placeholder="@_Localizer["ErrorMessageUserNameRequire"]" />
         <ValidationMessage For="() => Input.Email" class="ant-form-item-explain-error" />
         <InputText @bind-Value="Input.Password" type="password" class="ant-input SubmitContentInput" autocomplete="current-password" aria-required="true" placeholder="@_Localizer["ErrorMessagePasswordRequire"]" />
         <ValidationMessage For="() => Input.Password" class="ant-form-item-explain-error" />
     </div>     
 </EditForm>

这是模型：

  [SupplyParameterFromForm]
  private InputModel Input { get; set; } = new();

 private sealed class InputModel
 {        
     [EmailAddress(ErrorMessageResourceName = "ErrorMessageEMailVerify", ErrorMessageResourceType = typeof(TuskyPhoenix.Resources.Components.Account.Pages.Login))]
     [Required(ErrorMessageResourceName = "ErrorMessageUserNameRequire", ErrorMessageResourceType = typeof(TuskyPhoenix.Resources.Components.Account.Pages.Login))]
     public string Email { get; set; } = "";

     [Required(ErrorMessageResourceName = "ErrorMessagePasswordRequire", ErrorMessageResourceType = typeof(TuskyPhoenix.Resources.Components.Account.Pages.Login))]
     [DataType(DataType.Password)]
     public string Password { get; set; } = "";
 }

这是设置值的代码：

protected override async Task OnAfterRenderAsync(bool firstRender)
{
    if (firstRender)
    {
        var _uriBuilder = new UriBuilder(_NavigationManager.Uri);
        var _query = System.Web.HttpUtility.ParseQueryString(_uriBuilder.Query);
        var _result = _query["UserName"];
        if (_result is { })
        {
            Input.Email = _result;
        }
    }
}

当用户输入 URL“https://localhost:1434/Account/[email protected]”

可以成功获取查询参数[email protected]。

但是，将Input.Email的值设置为查询参数后，UI没有任何变化。

我实际上想做的是通过URL输入电子邮件。

我的代码有什么问题吗？它只是一种单向绑定吗？我怎样才能实现这个？

Answer 1

您需要将代码移至

OnInitialized

。以下问题和答案提供了原因。

1. 我应该使用 OnAfterRenderAsync 而不是 OnInitializedAsync 吗？

2. Blazor - 我应该在 OnInitializedAsync() 或 OnAfterRenderAsync(true) 中读取数据吗