Phenquestions
Vue.js adalah library yang sangat kuat, mudah dipelajari, dan mudah didekati yang dengan pengetahuan tentang HTML, CSS, dan Javascript, kita dapat mulai membangun aplikasi web di dalamnya. Vue.js dibangun dengan menggabungkan fitur terbaik dari Angular dan React Frameworks yang sudah ada. Ini adalah kerangka kerja Javascript progresif dan reaktif yang digunakan untuk membangun UI (Antarmuka Pengguna) dan SPA (Aplikasi Satu Halaman), itulah sebabnya para pengembang suka membuat kode dan merasakan kebebasan dan kenyamanan saat mengembangkan aplikasi di Vue.js.Jika kita melihat Event Listening and Handling di Vue.js., kita akan tahu bahwa itu memberikan arahan "v-on" untuk mendengarkan dan menangani acara. Kita dapat menggunakan arahan "v-on" untuk mendengarkan DOM dan melakukan tugas yang diperlukan. Ini juga menyediakan banyak event handler. Namun, dalam artikel ini, kita hanya akan belajar dan tetap fokus pada peristiwa klik. Jadi, mari kita mulai!
Sama seperti acara onClick Javascript, Vue.js menyediakan v-on:klik untuk mendengarkan acara.
Sintaks untuk v-on:click event akan seperti ini:
Vue.js menyediakan singkatan "@" alih-alih menggunakan "v-on" juga.
Vue.js tidak berhenti hanya dengan mendengarkan acara klik dan memanggil fungsinya. Ini juga akan memungkinkan kita untuk langsung menulis operasi aritmatika atau apapun yang berhubungan dengan Javascript di dalam tanda kutip “ ”. Seperti ini:
Vue.js memberi kita untuk memanggil metode atau fungsi dalam pernyataan Javascript sebaris, seperti yang ditunjukkan di bawah ini:
Menggunakan Vue.event handler js, kita juga dapat mengakses acara DOM, menggunakan pernyataan sebaris, dengan meneruskan Vue.js secara khusus menyediakan variabel “$event” ke dalam argumen metode, seperti contoh di bawah ini:
Vue.js juga menyediakan kita untuk memanggil beberapa fungsi atau metode. Kita dapat memanggil lebih dari satu fungsi dan memisahkannya dengan koma, seperti contoh berikut:
Vue.js menyediakan pengubah acara juga.
Pengubah Acara
Kita sering perlu memanggil pengubah bersama dengan acara. Jadi, Vue.js menyediakan beberapa pengubah berikut:
.berhenti
Ini akan menghentikan transmisi acara klik.
.mencegah
Ini akan mencegah halaman memuat ulang atau mengalihkan.
.sekali
Ini akan memicu acara klik hanya sekali.
.menangkap
Ini sebagian besar digunakan untuk menambahkan pendengar acara event.
Kita juga bisa merantai pengubahnya. Namun, perlu diingat bahwa urutan pengubah itu penting, dan itu akan mempengaruhi hasil.
Kesimpulan
Dalam artikel ini, kami telah membahas seluruh konsep penanganan acara Klik dari level noob hingga ninja. Kami telah belajar tentang sintaks yang berbeda dari menulis acara klik dan berbagai cara untuk menggunakannya v-on: klik arahan yang disediakan oleh Vue.js untuk kemudahan pengembang dan pengubah acara yang berbeda. Untuk konten yang lebih bermanfaat seperti ini, terkait dengan Vue.js, terus kunjungi linuxhint.com.
