UI元素僅在焦點從原始按鈕/輸入移開時更新

我遇到了一個問題，我按下一個按鈕，服務器會給出回應，但 UI 不會更新以顯示我為其設定的回應，直到我開始與其他東西互動。似乎無法弄清楚是什么導致了這種情況。一直在檢查代碼，在 UI 布局方面進行了更改，但似乎沒有任何效果。我這里有一個 gif 來更好地演示。我試過使用，StateHasChanged但這似乎也不起作用

剃刀頁面

<EditForm Model="@AssignUser" OnValidSubmit="@AddUserToProject">

@*    <DataAnnotationsValidator />*@
<div >
    <label > Assign Users </label>
    <InputText placeholder="Username" id="inlineFormInputGroup" type="email" @bind-Value="@AssignUser.UserName"  />

    <button type="submit" >Add</button>
</div>
</EditForm>
//display messages depending on outcome
@if (userNotFoundError == true)
{
    <div  role="alert">
        User could not be found
    </div>
}

@if (userExistsAlready == true)
{
    <div  role="alert">
        User is already on the project
    </div>
}

將用戶添加到專案功能

private bool userNotFoundError = false;
private bool userExistsAlready = false;
private async void AddUserToProject()
{
    try
    {
        var response = await Http.PutAsJsonAsync($"Projects/add/User/{AssignUser.UserName}/{projectItem.ProjectId}", AssignUser);

        // Attempt add adding someone who is already on the project?
        if (response.StatusCode == HttpStatusCode.Forbidden)
        {
            StateHasChanged();

            if (userNotFoundError == true)
            {
                userNotFoundError = false;
            }
            userExistsAlready = true;

            
        }
// Attempt at adding someone who does not exist as a user?
        else if (response.StatusCode == HttpStatusCode.BadRequest)
        {
            StateHasChanged();

            if (userExistsAlready == true)
            {
                userExistsAlready = false;
            }
            userNotFoundError = true;
        }
        else
        {
            var content = await response.Content.ReadAsStringAsync();
            var userobject = JsonConvert.DeserializeObject<ApplicationUser>(content);
            response.EnsureSuccessStatusCode();
            Navigation.NavigateTo("/projects");
            userNotFoundError = false;
            userExistsAlready = false;
            StateHasChanged();
        }

    }
    catch (Exception e)
    {
        userNotFoundError = true;
    }
}

在控制器中添加用戶功能

[HttpPut("add/User/{userName}/{projID}")]
public async Task<IActionResult> AddUserToProject(string userName, Guid projID)
{

    var project = _context.Projects.Include(u => u.AssignedUsersToProject).FirstOrDefault(p => p.ProjectId.ToString().Equals(projID.ToString()));

    try
    {
        var user = _context.Users.First(u => u.UserName.Equals(userName));

        if (!project.AssignedUsersToProject.Any(u => u.UserName.Equals(user.UserName))) { 
            project.AssignedUsersToProject.Add(user);                    
        } else
        {
            return Forbid();
        }
    }
    catch (InvalidOperationException)
    {
        return BadRequest();
    }

    try
    {
        await _context.SaveChangesAsync();
    }
    catch (DbUpdateConcurrencyException)
    {
        if (!ProjectExists(projID))
        {
            return NotFound();
        }
        else
        {
            throw;
        }
    }

    return NoContent();
}

uj5u.com熱心網友回復：

改變

private async void AddUserToProject()

到

private async Task AddUserToProject()

它應該作業。

然后，您還可以洗掉所有這些StateHasChanged()呼叫，它們不再起作用。

Blazor 不知道何時async void完成。當您使用async Task方法時，Blazor 將在該方法完成后自動重新呈現您的 UI。

但我確實懷疑顯示錯誤還有另一個問題。StateHasChanged() 呼叫應該“修復”了async void大多數分支。

標籤：asp.net核心 西装外套 剃刀页面 blazor-webassembly

上一篇：使用MVCRazor根據日期更改文本

下一篇：是否可以在沒有onclick方法的情況下以剃刀形式將選中狀態分配給當前復選框的值？