Rumah >hujung hadapan web >tutorial js >Bagaimana Menggunakan Pembolehubah Konteks dengan Nama Kelas CSS Tailwind?
Nama Kelas Dinamik dengan CSS Tailwind
Apabila menggunakan pembolehubah konteks dalam React, adalah perkara biasa untuk menghantar nilai ini sebagai nama kelas kepada Tailwind CSS. Walau bagaimanapun, pendekatan ini mungkin menghadapi pengehadan.
Konvensyen Penamaan CSS Tailwind
Menurut dokumentasi CSS Tailwind, ia hanya mentafsir rentetan tidak terputus lengkap sebagai nama kelas yang sah. Nama kelas dinamik yang dibina melalui interpolasi atau gabungan tidak akan dikenali.
Penyelesaian:
Contoh:
const colors = { // ... secondary: darkTheme ? "bg-[#FFFFFF]" : "bg-[#FFFFFF]", // ... };
Gunakan Sebaris Atribut Gaya:
<p className="text-text-white">
Dengan mematuhi penyelesaian ini, anda boleh menggabungkan pembolehubah konteks dengan berkesan ke dalam nama kelas CSS Tailwind anda.
Atas ialah kandungan terperinci Bagaimana Menggunakan Pembolehubah Konteks dengan Nama Kelas CSS Tailwind?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!