Umschließen Sie einen Bereich und dunkeln Sie ihn ab, solange er beschäftigt ist, zeigen Sie einen Spinner und blockieren Sie Klicks, damit niemand mit veralteten Daten arbeitet.
Warum es hilft
- Blockiert den Bereich
- Spinner obenauf
- Kündigt den Beschäftigt-Zustand an
Wo es passt
- Panels beim Laden
- Speichern
- Daten aktualisieren
Beispiel
<Stack Direction="StackDirection.Column" Spacing="2">
<Button OnClick="Load">Reload</Button>
<BusyOverlay Busy="_busy" Label="Loading orders">
<Card>
<Descriptions>
<DescriptionItem Label="Orders">@_count</DescriptionItem>
<DescriptionItem Label="Updated">@_updated</DescriptionItem>
</Descriptions>
</Card>
</BusyOverlay>
</Stack>
@code {
private bool _busy;
private int _count = 128;
private string _updated = "never";
private async Task Load()
{
_busy = true;
await Task.Delay(1800);
_count += 7;
_updated = DateTime.Now.ToString("T");
_busy = false;
}
}Ein kurzes Fragment. Fügen Sie @using RayCraft.Blazor.Components zu Ihrer Seite hinzu und nutzen Sie einen interaktiven Render-Modus.
In RayCraft Free enthalten. Funktionierende Beispiele finden Sie im GitHub-Repository (MIT); es enthält Beispiel- und Democode, nicht den Code der Bibliothek.