Un choix clair dans une courte liste. Utilisez une liste d’éléments pour les cas simples, ou des radios individuelles quand chaque option a besoin de son propre contenu.
Pourquoi c’est utile
- Un choix, clairement montré
- Options simples ou personnalisées
- Groupe accessible
Où il trouve sa place
- Mode d’expédition
- Oui, non, peut-être
- Choix d’une offre
Exemple
<RadioGroup @bind-Value="_plan" Label="Plan" Items="_plans" HelperText="Billed monthly." />
<RadioGroup @bind-Value="_size" Label="Size (row, with Radio children)" Direction="StackDirection.Row">
<Radio Value="Size.Small" Label="Small" />
<Radio Value="Size.Medium" Label="Medium" />
<Radio Value="Size.Large" Label="Large" />
</RadioGroup>
<span>Plan: @_plan, size: @_size</span>
@code {
private readonly string[] _plans = ["Free", "Team", "Enterprise"];
private string _plan = "Team";
private Size _size = Size.Medium;
}Un court fragment. Ajoutez @using RayCraft.Blazor.Components à votre page et utilisez un mode de rendu interactif.
Inclus dans RayCraft Free. Des exemples fonctionnels se trouvent dans le dépôt GitHub (MIT); il contient du code d’exemple et de démonstration, pas le code de la bibliothèque.