Belajar Tentang Directive Conditional Pada Vue js

09/04/2017    Ekky Ridyanto    919     Website

Hai teman teman kita mau belajar tentang directive pada Vue JS. Directive simplenya adalah fungsi-fungsi yang sudah otomatis ada didalam Vue JSnya. Contoh directive disini ada banyak tapi salah satu yang akan kita bahas adalah Directive Conditional artinya kita bisa melakukan if else loop atau perulangan jadi sama seperti kita belajar bahasa pemrograman lainnnya. Tentu ada cara penulisannya masing masing. Sebagai contoh kita mau membuatkan directive if dengan v-if didalam elemenya sebagai berikut

Belajar Tentang Directive Conditional Pada Vue Js

Jadi selama kondisinya true maka dia akan menampilkan aksi atau proses yang ada diantaranya. Tapi kita pun bisa membuat property done didalam object datanya yang mana done ini adalah nilai booleannya false seperti berikut

Belajar-Dasar-Tentang-Directive-Conditional-Pada-Vue-Js-09-04-2017-2

Kita tahu bila nilainya false untuk directive v-ifnya

Belajar-Dasar-Tentang-Directive-Conditional-Pada-Vue-Js-09-04-2017-3

Maka tidak akan terjadi apa apa dan kalo teman teman klik kanan inspect elemen pada browsernya dan lihat struktur HTMLnya maka sekarang didalamnya tidak ada apa apa. Jadi bukan sekedar display none tapi elemenya benar benar hilang dari struktur HTMLnya. Tentu kita pun bisa menampilkan v-else. Tentu else tidak perlu syarat kita bisa menuliskan seperti ini

Belajar-Dasar-Tentang-Directive-Conditional-Pada-Vue-Js-09-04-2017-4

Maka kita akan dapat feedback atau pesan kalo property donenya bernilai false.

Belajar-Dasar-Tentang-Directive-Conditional-Pada-Vue-Js-09-04-2017-5

Tapi bila saya ubah menjadi true maka kita dapat hasil yang di inginkan. Jadi itu dia penggunaan if else sederhananya didalam Vuejs. Terima kasih

Artikel, Web Design, Javascript, website

Cara Cepat Pintar Membuat Website, Tanpa Perlu Basic IT

Membuat website perusahaan, portal berita, blog, katalog online, dan e-commerce.

Learn More

Cara Cepat Pintar Membuat Website, Tanpa Perlu Basic IT

Membuat website perusahaan, portal berita, blog, katalog online, dan e-commerce.

Learn More