Início / coding / Perguntas / 79573001
Accepted
meez
Asked: 2025-04-14 19:12:08 +0800 CST

Como substituir o estilo quando ambas as condições são verdadeiras com o CSS do Tailwind

  • 772

No meu componente Astro, estou usando class:list para meu estilo tailwind.

Tenho a seguinte situação, em que ambas as condições são true, e quero isRedColorestar na liderança. Como posso resolver isso?

<span
  class:list={[
    'text-large bg-gray text-white font-bold',
    { 'bg-orange': theme === "orange" },
    { 'bg-red': isRedColor },
    classes,
  ]}
>
  {title}
</span>
conditional-statements

1 respostas

  1. Best Answer

    Adicione uma verificação adicional para verificar se isRedColoré falso para bg-orange.

    <span
  class:list={[
    'text-large bg-gray text-white font-bold',
    { 'bg-orange': theme === "orange" && !isRedColor },
    { 'bg-red': isRedColor },
    classes,
  ]}
>
  {title}
</span>
    • 1

relate perguntas