Apa Itu Component Pada Framework Vue Js

Sekarang kita akan belajar bagian yang paling penting dari Vue js yaitu tentang Component. Apa itu component. Component ini merupakan salah satu fitur penting dalam Framework Vue js bisa dibilang fitur ini mengijinkan programmer untuk memperluaskan elemen HTMLnya dengan membungkus dalam satu kode artinya component ini adalah sistem templating dimana kita membuat satu template tertentu untuk digunakan berkali kali terutama yang teman teman bermain dengan single page application yaitu aplikasinya dalam satu halaman dan kita punya beberapa component untuk digunakan berkali kali nah disitu kita bisa manfaatin yang namanya component ini. Langsung saja kita lihatkan contohnya pertama kita buat tag custom misalnya <alert> artinya kita bisa menuliskan tag html custom yang kita mau lalu kita buat tag pembuka dan penutupnya sebagai berikut

Apa-Itu-Component-Pada-Framework-Vue-js-1

Artinya seolah olah kita membuat elemen baru diHTML. Setelah itu kita akan membuat Object Vue extend dengan menentukan template untuk component yang kita buat dan kita simpan sebagai Object variabelnya

Apa-Itu-Component-Pada-Framework-Vue-js-2

Dan kita akan daftarkan template tersebut yaitu 'alert' menggunakan Vue component dan menentukan nama Object variabelnya sebagai component yang akan kita buat

Apa-Itu-Component-Pada-Framework-Vue-js-3

Jadi yang disebelah kiri yang kita daftarin didalam layoutnya lalu yang disebelah kanan nama variabel sebagai Object Vue extend yang menyimpan component templatenya. Jadi pastikan tidak ada yang error maka kalo kita lihat sekarang kita sudah bisa lihat component templatenya dibagian browsernya

Apa-Itu-Component-Pada-Framework-Vue-js-4

Jadi saya simpulkan lagi yang pertama kita harus define dulu atau kita jelaskan untuk bagian templatenya dengan Vue extend lalu yang kedua kita buat Vue Component untuk register component templatenya. Tentu untuk mendaftarkan component templatenya ada dua cara. Cara pertama kita bisa menggunakan Vue Extend seperti yang teman teman lihat diatas. Jadi itu dia cukup simple teman teman bisa lakukan apa saja dalam membuat sistem componentnya. Terima Kasih

25 April 2017

Webinar Gratis 2024


Selanjutnya Pada Bulan Maret 2024

Sabtu, 09 Maret 2024


10 Bahasa Rekomendasi Untuk Dipelajari di 2024

Python Developer, Data Science, Web Application

Kursus Python Django Web Application 2024 di DUMET School Kursus Postgre SQL Database Developer Terbaik 2024 di Jakarta
chat