Mengapa Nama Komponen React Perlu Dimulakan dengan Huruf Besar?

Nama Komponen dalam React: Capitalization Conundrum

Apabila bekerja dengan ReactJS, adalah perkara biasa untuk menghadapi gelagat pelik mengenai nama komponen. Tidak seperti elemen HTML, komponen React mesti bermula dengan huruf besar. Perbezaan ini timbul daripada keputusan seni bina asas dalam seni bina asas React.

React memanfaatkan JSX (JavaScript XML) untuk mentakrifkan elemen UI. Dalam JSX, nama teg huruf kecil ditafsirkan sebagai teg HTML, manakala nama teg huruf besar menunjukkan komponen React. Pembezaan ini dibuat kerana teg HTML berinteraksi dengan DOM asli penyemak imbas, manakala komponen React ialah elemen tersuai yang diuruskan oleh enjin penyelarasan dalaman React.

Pertimbangkan contoh berikut, di mana nama komponen bermula dengan huruf kecil:

var fml = React.createClass({
  render: function () {
    return <a href='google.com'>Go</a>;
  }
});

React.render(<fml />, document.body);

Kod ini tidak akan memaparkan elemen yang dimaksudkan. Sebaliknya, React mentafsir "fml" sebagai teg HTML dan cuba memadankannya dengan elemen yang sepadan dalam DOM. Walau bagaimanapun, memandangkan "fml" tidak wujud sebagai teg HTML yang sah, hasilnya ialah halaman kosong.

Apabila nama komponen ditukar kepada huruf besar, seperti dalam:

var Fml = React.createClass({
  render: function () {
    return <a href='google.com'>Go</a>;
  }
});

React.render(<Fml />, document.body);

React mengiktiraf "Fml" sebagai komponen dan memulakannya, membenarkan elemen yang dipaparkan muncul pada halaman.

Ringkasnya, nama komponen React mesti mulakan dengan huruf besar untuk membezakannya daripada tag HTML. Perbezaan ini memastikan pengurusan komponen yang betul dan pemaparan antara muka pengguna yang betul.

Atas ialah kandungan terperinci Mengapa Nama Komponen React Perlu Dimulakan dengan Huruf Besar?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!