GALIH L. PRAKOSO

Setelah belajar mengenai Component, sekarang kita akan belajar satu hal yang tidak kalah penting yaitu Props. Dengan Props kita dapat membuat Component kita lebih reusable (bisa digunakan kembali). 

Misalnya pada Component Image, kita bisa mengirimkan data sumber dari gambar yang akan kita tampilkan pada Component Image tersebut. Kita bisa mengirimkan data pada Component Image melalui salah satu props-nya yaitu source. Kita juga dapat memodifikasi tampilan Component Image melalui salah satu props yang dimiliki semua Component bawaan React Native yaitu style. Props style berguna untuk memodifikasi tampilan suatu Component. Mirip dengan CSS yang digunakan untuk mengatur tampilan pada HTML.

Selanjutnya kita akan coba membuat custom component dan kita akan coba menggunakan props untuk mengirim data pada component tersebut. Seperti biasa, buka Visual Studio Code dan langsung saja buka file App.js. Ubah file App.js menjadi seperti ini :

Pada kode diatas kita sudah membuat custom component berupa sebuah class Pahlawan yang meng-extends class React.Component. Dan pada component App kita menampilkan Component pahlawan dengan mengirimkan data berupa nama pahlawan melalui props nama.


Setelah mengubah file App.js jangan lupa untuk menyimpan perubahan dengan menekan Ctrl+S. Jika berhasil maka tampilannya akan seperti gambar di atas. (Untuk kamu yang belum bisa menjalankan aplikasi react native di smartphone atau emulator bisa mengikuti tutorial bagian kedua dan keempat). 👏

Cukup mudah bukan? Jika kalian memiliki pertanyaan jangan malu-malu untuk meninggalkan komentar pada kolom komentar di bawah ini. Jika tidak, mari lanjut ke tutorial selanjutnya!. 👇

Tutorial React Native Dasar - Bahasa Indonesia - #6 State