Vue JS adalah salah satu Framework atau library Javascript, Framework ini merupakan Framework yang di buat untuk kebutuhan Frond End dari sebuah aplikasi web agar aplikasi web tersebut lebih interaktif. baiklah kali ini kita akan belajar Menampilkan Data Array di Vuejs. yuk kita praktekan teman teman.
pertama tama kita buat file index. html dan buat struktur htmlnya seperti berikut,.
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title> Array Vue JS </title> </head> <body> </body> </html>
setelah itu seperti biasa kita install dulu vuejs nya dengan mengcopy kan link berikut di index.html kita. https://cdn.jsdelivr.net/npm/vue/dist/vue.js
pasang di index html kita
setelah itu kita buat objek vue yang di tampung oleh variabel app, yang mana di dalam objek tersebut terdapat key el dan data, dan di dalam body html juga buat div dengan #app
di dalam key data kita masukan data array, misalkan data nama nama hewan,
dan setelah itu kita looping di dalam #app nya. kita buat ul dan li di dalam #app tersebut, dan dengan kode v-for kita akan melooping data hewan tersebut, dan untuk mencetak nya kita butuh kode {{ cetak disini }}
dan coba kita lihat di webrowser kita.
maka data hewan tersebut berhasil kita tampilkan,
sekian tutorial Menampilkan Data Array di Vuejs, semoga bermanfaat yah teman teman.
The post Menampilkan Data Array di Vuejs appeared first on Kursus Website Terbaik.