Menampilkan Data Array di Vuejs
Vue JS ialah diantara Framework atau library Javascript, Framework ini adalah sebuah Framework yang di bikin bagi keperluan Frond End dari sebuah program web agar program web tersebut lebih interaktif. baiklah kali ini kita akan belajar Menampilkan Data Array di Vuejs. yuk kita praktekan teman teman.
pertama-tama tama kita bikin file index. html dan bikin 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 lazimnya 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 bikin objek vue yang di tampung oleh variabel app, yang mana di pada objek tersebut terdapat key el dan data, dan di pada body html pun bikin div dengan #app
di pada key data kita masukan data array, misalkan data nama nama hewan,
dan setelah itu kita looping di pada #app nya. kita bikin ul dan li di pada #app tersebut, dan dengan kode v-for kita akan melooping data hewan tersebut, dan bagi mencetak nya kita butuh kode {{ cetak disini }}
dan coba kita lihat di webrowser kita.
karenanya data hewan tersebut berhasil kita tampilkan,
demikianlah panduan Menampilkan Data Array di Vuejs, semoga bermanfaat yah teman teman.
Sumber https://kursuswebsite.org
