我使用 bool 属性在用户单击按钮后禁用它，这样单击就不会发生两次。
private bool DisablePlaceOrderButton { get; set; } = false;
private void PlaceOrder_Clicked()
{
DisablePlaceOrderButton = true;
StateHasChanged();
if (cart.Lines.Count() == 0)
{
DisablePlaceOrderButton = false;
return;
}
...
}
按钮设计如下:
<button @onclick="@PlaceOrder_Clicked" disabled="@DisablePlaceOrderButton">Place Order</button>
但这不起作用，只有在 PlaceOrder 方法执行完毕后按钮才被禁用。
我对 ajax 指示器有同样的问题，方法执行后应该显示，完成后应该隐藏，使用 if block 。
在这两种情况下，statehaschanged 都没有效果。我使用 Blazor 服务器端预览版 9。如何使这些工作正常？
请阅读 agua 来自 mars 的评论，并按照此代码示例查看它是如何工作的...当您单击按钮时，会调用 DisablePlaceOrder 方法，标题文本会更改以反射(reflect)正在进行的操作 Action ，在此期间按钮被禁用。这发生在 3 秒的跨度内，包括重新呈现控件以反射(reflect)视觉变化。请注意，不会调用 StateHasChanged。
在实际应用中，当然不会使用 Task.Delay 方法，而是调用执行密集工作的方法...
<button type="button" @onclick="@PlaceOrder_Clicked" disabled="@DisablePlaceOrderButton">@Title</button>
@code{
private bool DisablePlaceOrderButton { get; set; } = false;
public string Title { get; set; } = "Place Order";
private async Task PlaceOrder_Clicked()
{
await DisablePlaceOrder();
//if (cart.Lines.Count() == 0)
//{
DisablePlaceOrderButton = false;
Title = "Place Order";
// return;
//}
}
async Task DisablePlaceOrder()
{
DisablePlaceOrderButton = true;
Title = "Wait...";
await Task.Delay(3000);
}
}