Ошибка цветопередачи фона при перезапуске сайта. ⇐ Html

[Anonymous]

Я создаю веб-сайт с использованием NextJs и Tailwindcss, но столкнулся с проблемой.
Каждый раз, когда я перезапускал веб-сайт, цвета этих кнопок исчезали, за исключением черного
[page.tsx]

Код: Выделить всё

{cars[currentModel]?.colors?.map((color, colorIndex) => {
const btnColorClass = cars[currentModel]?.btnColors?.[colorIndex] || 'bg-gray-500';
return (
 {
setCurrentColor(colorIndex)
if (colorApi?.scrollTo) {
colorApi.scrollTo(colorIndex)
}
}}
/>
);
})}

вот мой файл ts, который я подключил

Код: Выделить всё

export const cars: {model: string; colors: string[]; btnColors: string[];} [] =  [
{
model: "EX5",
colors: ["black", "gray", "silver", "teal", "white"],
btnColors: ["black", "gray-400", "gray-200", "teal-400", "gray-100"],
},
{
model: "Starray",
colors: ["black", "gray", "silver", "blue", "green", "white"],
btnColors: ["black", "gray-400", "gray-200", "blue-400", "green-800", "gray-100"],
},
];

export default cars;

кто-нибудь знает, как это исправить?
Я обнаружил, что копирование цвета и вставка его в btnColorClass в page.tsx исправляет это, но мне приходится делать это один за другим, и когда я перезапускаю его, все снова становится пустым.
Кроме того, после проверки элемента в браузере кажется, что стиль и все было правильно, но цвета фона отображаются как rgba(0,0,0,0).

Подробнее здесь: https://stackoverflow.com/questions/797 ... -restarted