Vue.js - это очень мощная, простая в освоении и доступная библиотека, которая, зная HTML, CSS и Javascript, может начать создавать в ней веб-приложения. Vue.js построен путем объединения лучших функций из уже существующих Angular и React Framework. Это прогрессивная и реактивная структура Javascript, которая используется для создания пользовательских интерфейсов (пользовательских интерфейсов) и SPA (одностраничных приложений), поэтому разработчики любят кодировать и чувствовать свободу и комфорт при разработке приложений на Vue.js.Если мы посмотрим на прослушивание и обработку событий во Vue.js., мы будем знать, что он предоставляет директиву «v-on» для прослушивания и обработки событий. Мы можем использовать директиву «v-on» для прослушивания DOM и выполнения необходимых задач. Он также предоставляет множество обработчиков событий. Однако в этой статье мы изучим только события кликов и сосредоточимся на них. Итак, приступим!
Как и событие onClick в JavaScript, Vue.js предоставляет v-on: click для прослушивания событий.
Синтаксис события v-on: click будет таким:
Vue.js также предоставляет сокращенное обозначение «@» вместо использования «v-on».
Vue.js не останавливается только на прослушивании события щелчка и вызове функции. Это также позволит нам напрямую писать любые арифметические операции или все, что связано с Javascript, внутри кавычек «». Именно так:
Vue.js позволяет нам вызывать метод или функцию во встроенном выражении Javascript, как показано ниже:
Использование Vue.js, мы также можем получить доступ к событию DOM, используя встроенный оператор, передав Vue.js специально предусмотрена переменная «$ event» в аргументе метода, как в примере ниже:
Vue.js также позволяет нам вызывать несколько функций или методов. Мы можем вызвать несколько функций и разделить их запятыми, как в этом примере:
Vue.js также предоставляет модификаторы событий.
Модификаторы событий
Нам часто нужно вызывать модификаторы вместе с событиями. Итак, Vue.js предоставляет некоторые из следующих модификаторов:
.останавливаться
Это остановит передачу события клика.
.предотвращать
Это предотвратит перезагрузку страницы или перенаправление.
.однажды
Он вызовет событие щелчка только один раз.
.захватывать
В основном он используется для добавления прослушивателя событий.
Мы также можем связать модификаторы. Однако имейте в виду, что порядок модификаторов имеет значение, и это повлияет на результаты.
Заключение
В этой статье мы рассмотрели все концепции обработки событий Click от новичка до уровня ниндзя. Мы узнали о различных синтаксисах записи событий щелчка и различных способах использования v-on: нажмите
директива, предоставленная Vue.js для удобства разработчиков и различные модификаторы событий. Для получения более полезного контента, подобного этому, связанного с Vue.js, продолжайте посещать linuxhint.ком.