Barra de navegación inferior
Las barras de navegación inferiores permiten movimiento entre destinos primarios en una aplicación.
La barra de Navegación Inferior muestra de tres a cinco destinos en la parte inferior de una pantalla. Cada destino es representado por un icono y una etiqueta de texto opcional. Cuando un icono de navegación inferior es tocado, el usuario es llevado al destino de navegación superior asociado con ese icono.
Barra de navegación inferior
Si hay **cuatro ** o cinco acciones, mostrar vistas inactivas solamente como iconos.
<BottomNavigation
showLabels
value={value}
onChange={(event, newValue) => {
setValue(newValue);
}}
>
<BottomNavigationAction label="Recents" icon={<RestoreIcon />} />
<BottomNavigationAction label="Favorites" icon={<FavoriteIcon />} />
<BottomNavigationAction label="Nearby" icon={<LocationOnIcon />} />
</BottomNavigation>Botón de navegación sin texto
Si hay **cuatro ** o cinco acciones, mostrar vistas inactivas solamente como iconos.
Fixed positioning
This demo keeps bottom navigation fixed to the bottom, no matter the amount of content on-screen.
Librería externa de routing
One frequent use case is to perform navigation on the client only, without an HTTP round-trip to the server. The BottomNavigationAction component provides the component prop to handle this use case. Here is a more detailed guide.