在Blazor中禁用异步功能的按钮

时间:2019-09-19 17:28:21

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

我的页面上有以下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和disable不会真正显示为已完成。我想念什么?

1 个答案:

答案 0 :(得分:2)

使用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
}