Bagaimanakah Saya Boleh Menambah Kelas Secara Dinamik untuk Komponen Bertindak balas?

Mempertingkatkan Nama Kelas Secara Dinamik dalam React

Dalam React, selalunya perlu menambahkan kelas secara dinamik pada set nama kelas yang dipratentukan. Babel menyediakan penyelesaian yang mudah untuk senario ini.

Mencapai Penambahan Kelas Dinamik

Untuk menambah kelas dinamik pada senarai kelas biasa, anda boleh menggunakan pendekatan berikut dalam JSX:

className={'wrapper searchDiv ' + this.state.something}

Pecahan kod ini menggabungkan rentetan literal "searchDiv pembalut" dengan nilai this.state.sesuatu untuk mencipta className. Sebagai alternatif, anda boleh menggunakan templat rentetan:

className={`wrapper searchDiv ${this.state.something}`}

Kedua-dua penyelesaian ini bergantung pada fakta bahawa dalam JSX, apa-apa yang disertakan dalam kurungan kerinting dilaksanakan sebagai JavaScript. Oleh itu, anda mempunyai fleksibiliti untuk menjana nama kelas secara dinamik menggunakan pembolehubah atau nilai keadaan.

Nota Penting

Walaupun tergoda untuk menggabungkan rentetan JSX dan kurungan kerinting untuk atribut, adalah penting untuk mengelakkan perkara ini. berlatih. Hanya JavaScript dibenarkan dalam kurungan kerinting dalam JSX.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Menambah Kelas Secara Dinamik untuk Komponen Bertindak balas?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!