styled() / styled.tag

Styled-Components 🟢 Junior

Définition

Fonction principale qui crée un composant React avec des styles scopes. styled.div créé un div style, styled(Component) étend un composant existant.

Analogie

Un décorateur qui habille un élément HTML ou un composant existant avec de nouveaux vêtements.

Exemple de code

const Card = styled.div`
  padding: 1rem;
  border-radius: 8px;
`
// Extend un composant existant
const PrimaryCard = styled(Card)`
  background: blue;
  color: white;
`

Cas d'usage

Créer des composants React avec du CSS scope et extensible via l'héritage de styles.

#styling#interview#css-in-js

← → au clavier pour passer d'une fiche à l'autre