• Empleos
  • Sobre nosotros
  • profesionales
    • Inicio
    • Empleos
    • Cursos y retos
  • empresas
    • Inicio
    • Publicar vacante
    • Nuestro proceso
    • Precios
    • Evaluaciones
    • Nómina
    • Blog
    • Comercial
    • Calculadora de salario

0

150
Vistas
¿Cómo usar sx prop en reaccionar para cambiar el color de una barra de navegación?

Estoy intentando crear una barra de navegación negra en reaccionar. Aquí está mi código hasta ahora:

 import UploadIcon from "@mui/icons-material/Upload"; import CustomButton from "./CustomButton"; import AppBar from '@mui/material/AppBar'; import Toolbar from '@mui/material/Toolbar'; import {createMuiTheme} from '@material-ui/core/styles' const Header = () => { return ( <AppBar sx = {{color:'black'}} position="sticky"> <Toolbar variant="dense"> <CustomButton text='Upload' endIcon={<UploadIcon/>}/> </Toolbar> </AppBar> ) } export default Header;

Las técnicas que he intentado hasta ahora para cambiar el color de mi barra de aplicaciones han sido soluciones propuestas aquí: https://smartdevpreneur.com/setting-material-ui-appbar-color-and-styling/#Method_1_Styling_AppBar_With_Classes

Todos los hilos anteriores que he visto en el desbordamiento de pila sobre esto tampoco me han ayudado. ¿Cómo cambio el color de mi barra de navegación?

almost 3 years ago · Juan Pablo Isaza
1 Respuestas
Responde la pregunta

0

Diseñar la barra de herramientas en lugar de diseñar la barra de aplicaciones funcionó. Aquí está mi código final

 import UploadIcon from "@mui/icons-material/Upload"; import CustomButton from "./CustomButton"; import AppBar from '@mui/material/AppBar'; import Toolbar from '@mui/material/Toolbar'; import {createMuiTheme} from '@material-ui/core/styles' const Header = () => { return ( <AppBar position="sticky"> <Toolbar sx = {{background:'black',}} variant="dense"> <CustomButton text='Upload' endIcon={<UploadIcon/>}/> </Toolbar> </AppBar> ) } export default Header;
almost 3 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Nuestro proceso Comercial
Legal
Términos y condiciones Política de privacidad
© 2025 PeakU Inc. All Rights Reserved.

Andres GPT

Recomiéndame algunas ofertas
Necesito ayuda