Di Bereaksi (kerangka kerja Facebook), saya perlu membuat elemen label terikat ke input teks menggunakan foratribut standar .
misalnya JSX berikut digunakan:
<label for="test">Test</label>
<input type="text" id="test" />Namun, ini menghasilkan HTML yang tidak memiliki foratribut yang diperlukan (dan standar) :
<label>Test</label>
<input type="text" id="test">Apa yang saya lakukan salah?
Jawaban:
The foratribut disebut htmlForuntuk konsistensi dengan API properti DOM. Jika Anda menggunakan build pengembangan React, Anda seharusnya melihat peringatan di konsol Anda tentang ini.
labelunsur (seperti dikembalikan oleh document.createElement, document.getElementById, dll) Anda akan mengakses nya forproperti sebagai label.htmlFor.
Ya, untuk bereaksi,
for menjadi htmlFor
class menjadi className
dll.
lihat daftar lengkap bagaimana atribut HTML diubah di sini:
Untuk Bereaksi, Anda harus menggunakannya per kata kunci untuk mendefinisikan atribut html.
class->className
digunakan dan
for->htmlFor
digunakan, karena reaksi adalah case sensitif pastikan Anda harus mengikuti modal kecil dan sesuai kebutuhan.
keduanya fordan classkata-kata yang dicadangkan dalam JavaScript ini adalah mengapa ketika datang ke atribut HTML di JSX Anda perlu menggunakan sesuatu yang lain, tim Bereaksi memutuskan untuk menggunakan htmlFordan classNamemasing - masing
foradalah kata yang dilindungi undang-undang dalam JavaScript, Bereaksi elemen yang akan digunakan htmlFor.": Reactjs.org/docs/dom-elements.html#htmlfor
htmlForuntuk mengganti for!Anda dapat menemukan lebih banyak info dengan mengikuti tautan di bawah ini.
https://facebook.github.io/react/docs/dom-elements.html#htmlfor
Itu adalah htmlFor di JSX dan class adalah className di JSX