【问题标题】:Disabling button from async function in Blazor从 Blazor 中的异步功能禁用按钮
【发布时间】:2020-01-20 19:04:08
【问题描述】:

我的页面上有以下 EditForm 模型:

<EditForm Model="@projectParameters" OnValidSubmit="@SubmitProject">
       <MatButton Raised="true" Type="submit" Disabled="@saveButtonDisabled">@saveButtonName</MatButton>
</EditForm>

然后是以下函数:

private async Task SubmitProject()
    {
        DisableSave();

        if (pageType == "Create")
        {
            await CreateProject();
        }
        else if (pageType == "Create")
        {
           await EditProject();
        }
    }

void DisableSave()
    {
        saveButtonDisabled = true;
        saveButtonName = "Saving...";
        StateHasChanged();
    }

SubmitProject 和 DisableSave 被正确调用,但是当 CreateProject 工作时 saveButtonName 和 disabled 从未真正显示为已完成。我错过了什么?

【问题讨论】:

  • 这是一种非常粗暴的方法......

标签: validation asynchronous blazor blazor-client-side matblazor


【解决方案1】:

await Task.Delay(1);刷新更改:

private async Task SubmitProject()
{
    await DisableSave();
    ...

然后

async Task DisableSave()
{
    saveButtonDisabled = true;
    saveButtonName = "Saving...";
    await Task.Delay(1); //flush changes
    StateHasChanged(); // not needed
}

【讨论】:

  • 这行得通,谢谢!!你能解释一下为什么吗?有时我仍然无法理解一些异步内容。
  • 这不是关于异步,是关于虚拟 DOM,仅在调用结束时发送差异,释放 UI 线程差异也会发送。这是我发现的方法,但我不认为这是更好的方法,我就是这样做的。
  • 我在这里有关于这个主题的另一个聪明的答案:stackoverflow.com/a/56675814/842935 Just checkout。
猜你喜欢
  • 1970-01-01
  • 2023-01-10
  • 2020-09-19
  • 2015-02-23
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2010-10-04
  • 1970-01-01
相关资源
最近更新 更多