Dalam Kesempatan kali ini kita akan belajar bagaimana cara membuat check dan uncheck dengan vuejs, dimana kita mempunyai beberapa pilihan atau checkbox dari data yang akan nanti dipilih, jadi saya harap sahabat bisa mengikutin tutorial ini dengan seksama, oke supaya tidak terlalu lama bagaimana cara pembuatannya mari simak langkah-langkah berikut.Cara membuat check dan uncheck dengan VueJs disini sangat sederhana dan semoga sahabat cepat memahaminya, baiklah sekarang mulai ketikkan untuk strukturnya berikut ini:

Jika dilihat pada struktur diatas ada sebuah plugin library dari VueJs, jadi langsung yang digunakan secara online saja supaya cepat, selanjutnya ada input checkbox yang nanti digunakan untuk menampilkan daftar data. Dan perlu di perhatikan ada attribute v-for yang digunakan untuk looping data tetapi disini akan dibuat menjadi list data yang akan ditampilkan.

Jadi selanjutnya dibuat data yang akan ditampilkan pada attribute v-for maka coba ketikkan script dibawah ini :

Oke sahabat jika sudah ketikkan semua script maka coba jalankan pada browser ,lihat hasilnnya seperti berikut ini:

Membuat Check Uncheck dengan VueJs

Membuat Check Uncheck dengan VueJs

Dari gambar diatas saat checkbox terpilih satu dan menekan tombol check maka akan muncul alert Check All dan saat checkbox terchecklis semua lalu jika menekan tombol akan muncul alert Uncheck All.

Demikian pembahasan artikel kali ini tentang cara membuat check dan uncheck dengan vuejs, semoga bermanfaat dan sampai jumpa dengan pembahasan lainnya.

terima kasih.