Estoy trabajando en mi propio proyecto según el plan "de cero a héroe". Mi amigo me contó sobre los componentes con estilo y decidí reemplazar mi .css transparente y pasar a los componentes con estilo.
Sé cómo funciona en básico. <MyComponent> y const MyComponent = styled.div css, css, css
Estoy luchando por estas 2 situaciones.
<div className={color ? 'header header-bg' : 'header'}> ¿Cómo codificarlo para componentes con estilo? ¿Te gusta <MyComponent={color ? 'header header-bg' : 'header'}> Pero no sé qué más...
En estilos claros tengo muchas situaciones como
.class1, .class2, .class3 {estilos}
¿Cómo puedo escribirlo en componentes con estilo, por favor? Por ahora, tengo 3 veces el mismo código para cada clase 1-3, y eso no es bueno. También probé algo como const Class1, Class2 = styled.div pero no funciona
puede pasar los accesorios en componentes con estilo en lugar de operadores ternarios, aquí el enlace puede ver el ejemplo Agregar color de fondo condicionalmente en componentes con estilo y const Class1, Class2 = styled.div esto no funcionará, debería haber hecho esto
const Class1 = styled.div`` const Class2 = styled.div`` const Class3 = styled.div``Y debe aprender sobre los componentes con estilo de este enlace