Da a las personas la acción que más usan con un clic y las relacionadas a un clic más. SplitButton une una acción principal con un menú de alternativas, construido con los mismos elementos de menú que ya usas en otros sitios.
Por qué ayuda
- Acción predeterminada rápida
- Acciones relacionadas en un menú
- Mismos elementos que Menu
Dónde encaja
- Guardar y Guardar como
- Enviar y Programar envío
- Exportar en distintos formatos
Ejemplo
<Stack Align="center" Wrap="true">
<SplitButton Label="Save" Icon="IconName.Save" OnClick="@(() => _last = "Save")">
<MenuItem Icon="IconName.Copy" OnClick="@(() => _last = "Save as copy")">Save as copy</MenuItem>
<MenuItem Icon="IconName.Download" OnClick="@(() => _last = "Export")">Export</MenuItem>
</SplitButton>
<SplitButton Label="Publish" Color="ButtonColor.Success" Variant="Variant.Outlined" OnClick="@(() => _last = "Publish")">
<MenuItem OnClick="@(() => _last = "Schedule")">Schedule</MenuItem>
</SplitButton>
<span>Last action: @_last</span>
</Stack>
@code {
private string _last = "none";
}Un breve fragmento. Añade @using RayCraft.Blazor.Components a tu página y usa un modo de renderizado interactivo.
Incluido en RayCraft Free. Hay ejemplos que funcionan en el repositorio de GitHub (MIT); contiene código de ejemplo y demostración, no el código de la biblioteca.