Как перезаписать стиль компонента, при передаче нового стиля через props?

Question

[batonpeton]

У кнопки есть родной цвет, но при изменении его через props цвет не меняется

<button v-bind:class="{
        'py-[10px] px-[25px]': isHeader,
        'py-[16px] px-[20px]':isBanner,
        'py-[12px] px-[34px]':isTransport,
        'bg-arrow bg-no-repeat bg-[center_right_8px] bg-[#495AB4] ': Arrow,
        'py-[12px] px-[75px]':About
    }"  class="header_btn rounded-md bg-cargo-blue text-white z-20">{{ title }}</button>

Answer 1

[Антон Антон]

Посмотреть в инспекторе на применяемые классы. возможно вместо bg-[#495AB4] надо !bg-[#495AB4]
Ну и изучить на досуге https://developer.mozilla.org/ru/docs/Web/CSS/Spec...
и https://tailwindcss.com/docs/theme чтобы выпилить непосредственное указание размеров и цветов, которые наверняка будут повторяться

Comments

[batonpeton]

Спасибо!!