Skip to main content

Pendahuluan

Komponen kustom mendukung definisi properti (propTypes) yang memperkaya komponen pada level properti. Menambahkan properti kustom meningkatkan tingkat kustomisasi sekaligus membuat komponen lebih fleksibel dan lebih selaras dengan kebutuhan bisnis, seperti ditunjukkan di bawah ini: Properti komponen dapat ditambahkan melalui tombol “Add Item”, diubah melalui tombol “Edit”, atau dihapus melalui tombol “Delete”. Klik tombol “Edit” untuk melihat seluruh item konfigurasi sebuah properti komponen, seperti ditunjukkan di bawah ini. Semua definisi properti komponen kustom dapat dilihat dan dikonfigurasi pada halaman Component Preview (untuk debugging tipe properti sederhana) atau setelah komponen dipasang di dalam aplikasi (untuk konfigurasi properti kompleks, termasuk debugging terkait kode), seperti ditunjukkan di bawah ini. Deskripsi rinci untuk setiap item konfigurasi disediakan di bawah ini.

Judul properti

Nama properti yang dikonfigurasi untuk komponen kustom. Nilai Default dari Judul properti adalah “Property Title”. Judul yang jelas dan intuitif membantu pengguna memahami arti properti atau mengidentifikasi konten yang perlu mereka masukkan. Ketika komponen ini digunakan pada suatu halaman, tampilannya seperti di bawah ini:

Nama properti

Nama properti sebuah komponen adalah Key properti, mirip dengan props.xxx pada sebuah class. Nilai default-nya adalah propName. Anda dapat mengikat variabel di Page Design untuk mengendalikan komponen. Sebagai contoh, nilai properti dari komponen kustom dapat digunakan sebagai Judul komponen yang disarangkan di dalamnya, seperti ditunjukkan di bawah ini.
Catatan: Nama properti sebuah komponen tidak boleh kosong; jika kosong, akan terjadi kesalahan saat komponen dipanggil atau diberi nilai.

Tipe properti

Tipe properti sebuah komponen mirip dengan tipe data umum. Terdapat tujuh tipe: Teks, boolean, Angka, object, array, Fungsi, dan Element. Setiap tipe data berkorespondensi dengan beberapa setter untuk memenuhi kebutuhan pengguna dalam memproses data pada dimensi yang berbeda, seperti ditunjukkan di bawah ini.

Setter

Komponen dengan tipe properti yang berbeda memiliki setter properti yang berbeda pula, yang mendukung metode rendering komponen dan pemrosesan data yang berbeda. Sebagai contoh, tipe Teks berkorespondensi dengan lima setter, seperti ditunjukkan di bawah ini.

Default

Bidang yang ditampilkan secara default pada komponen kustom saat pengguna mengakses formulir. Efeknya ditunjukkan di bawah ini.

Aktifkan pengikatan variabel

Pengikatan variabel di Page Design.

Sembunyikan

Mengontrol apakah properti disembunyikan. Opsi ini jarang digunakan.

On Change

Digunakan untuk menghubungkan beberapa properti. Opsi ini jarang digunakan.

Tata letak

Terdapat dua opsi: Block dan Inline, yang digunakan untuk mengatur bagaimana komponen kustom disusun pada halaman.