.attrs()

Definition

Methode chainable qui attache des attributs par defaut ou calcules a un styled component. Evite de repeter les memes props a chaque utilisation.

Analogie

Les reglages par defaut d'un appareil : tu les configures une fois, plus besoin d'y penser.

Exemple de code

const Input = styled.input.attrs(({ $size }) => ({
  type: 'text',
  size: $size || '1em',
}))`
  padding: ${({ size }) => size};
  border: 1px solid #ccc;
  border-radius: 4px;
`
// <Input $size="2em" />

Cas d'usage

Definir des attributs HTML par defaut (type, role, aria-*) sur un styled component.

Termes lies