Latihan 1 dari materi Props di Vue — praktek dengan editor kode interaktif, test case otomatis, dan hint terpandu. Langsung jalan di browser.
Starter-nya sudah punya title ("Laptop") dan price ("Rp15.000.000") di parent, dan child ProdukCard yang template-nya menampilkan {{ title }} di <h2 id="title"> dan {{ price }} di <span id="price">. Kirim kedua nilai itu ke child lewat props:
ProdukCard, tambahkan opsi props: { title: String, price: String }.---template---, ganti komentar TODO dengan <component :is="ProdukCard" :title="title" :price="price" />.Tanpa opsi props, {{ title }} di child gak menemukan apa-apa dan tampil kosong.
Yang dicek:
#title berisi persis Laptop, dan #price persis Rp15.000.000.{{ }} di template child, bukan teks yang diketik.ProdukCard menyatakan props berisi title dan price.:title="title" dan :price="price".
