Komponen adalah bagian dari suatu aplikasi yang biasa terdiri dari
prop dan state. Dalam react native komponen ini dapat dibangun
dengan 2 cara yaitu functional component (tidak memiliki
state) dan class component (memiliki state dan prop). Didalam
komponen dapat terdiri dari komponen-komponen kecil lainnya yang
artinya menunjukan suatu bagian. Contoh : Membuat menu navigasi
pada aplikasi, dimana dalam navigasi tersebut dapat terdiri dari
berbagai komponen seperti tombol menu home, biodata dan
seterusnya seperti berikut :
Berikut adalah 6 jenis komponen yang sering dipakai dalam
membuat aplikasi dengan react native :
a. Komponen View – Sebagai wadah untuk komponen lainnya.
b. Komponen Text – Untuk memunculkan sebuah Text.
c. Komponen Image – Untuk memunculkan sebuah Gambar.
d. Komponen TextInput – Untuk menerima inputan ke aplikasi.
e. Komponen ScrollView – untuk scroll halaman naik-turun.
f. Komponen SyleSheet - untuk style komponen-komponen.
Berikut contoh membuat komponen secara custome dengan dua
cara seperti berikut pada file index.tsx:
- Functional Component (Hooks)
Dalam contoh sintak Functional Component terdapat dua komponen
yang dibuat secara custome yaitu Biodata dan Foto. Dengan output
aplikasi seperti berikut :
- Class Component
Dalam contoh sintak Class Component terdapat dua komponen yang
dibuat secara custome yaitu Biodata dan Foto (sama seperti
functional component sebelumnya). Dengan output aplikasi seperti
berikut :