Bagaimanakah Saya Boleh Menambah dan Mengurus Nama Kelas Secara Dinamik dalam JSX?

Mempertingkatkan Nama Kelas Secara Dinamik dalam JSX

Dalam JSX, meningkatkan nama kelas secara dinamik boleh menjadi mencabar. Satu keperluan biasa ialah menambah kelas bersyarat berdasarkan keadaan atau prop. Begini cara anda boleh mencapai ini:

Pilihan 1: Penggabungan JavaScript

<div className={'wrapper searchDiv ' + this.state.something}>
  ...
</div>

Kaedah ini memanfaatkan penggabungan JavaScript untuk menambah kelas dinamik pada senarai kelas sedia ada.

Pilihan 2: Templat Rentetan Literals

<div className={`wrapper searchDiv ${this.state.something}`}>
  ...
</div>

String template literals (backtick) menyediakan sintaks yang lebih bersih untuk membina nama kelas dinamik. Mereka membenarkan anda membenamkan ungkapan dalam rentetan menggunakan ${}.

Nota:

• Ingat, atribut JSX dianggap sebagai kod JavaScript, jadi anda boleh melaksanakan JavaScript dalam kurungan kerinting.
• Walau bagaimanapun, menggabungkan rentetan JSX dan kurungan kerinting dalam atribut bukanlah disokong.
• Kedua-dua penggabungan JavaScript dan literal templat rentetan menawarkan penyelesaian yang berdaya maju untuk manipulasi nama kelas dinamik dalam JSX.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Menambah dan Mengurus Nama Kelas Secara Dinamik dalam JSX?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!