Wissen Sie, welche Bildschirmgröße Ihr Benutzer hat, und lassen Sie Ihren Code reagieren, wenn sie sich ändert.
Warum es hilft
- Benannte Breakpoints
- Aktualisiert bei Größenänderung
- Einfach
Wo es passt
- Responsive Logik
- Layoutänderungen
- Menüs
Beispiel
<BreakpointObserver>
<p>Current breakpoint: <strong>@context</strong> (resize the window to see it change).</p>
@if (context >= Breakpoint.Lg)
{
<Alert Severity="Severity.Info">Wide layout: the sidebar is shown.</Alert>
}
else
{
<Alert Severity="Severity.Warning">Narrow layout: the sidebar is hidden.</Alert>
}
</BreakpointObserver> 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.