Vue.JS Haga clic en Eventos

Vue.JS es una biblioteca muy poderosa, fácil de aprender y accesible que con el conocimiento de HTML, CSS y JavaScript, podemos comenzar a construir aplicaciones web en él. Vue.JS se construye combinando las mejores características de los marcos Angular y React ya existentes. Es un marco de JavaScript progresivo y reactivo que se utiliza para construir UI (interfaces de usuario) y SPA (aplicaciones de una sola página), por lo que a los desarrolladores les encanta codificar y sentir libertad y comodidad mientras desarrollan aplicaciones en Vue.js.Si echamos un vistazo al evento escuchando y manejando en Vue.js., Sabremos que proporciona una directiva "V-ON" para escuchar y manejar eventos. Podemos usar la directiva "V-ON" para escuchar el DOM y realizar las tareas requeridas. También proporciona muchos manejadores de eventos. Sin embargo, en este artículo, solo aprenderemos y mantendremos nuestro enfoque en los eventos de clics. Entonces empecemos!

Al igual que el evento OnClick de JavaScript, Vue.JS proporciona V-ON: haga clic para escuchar eventos.

La sintaxis para el evento V-on: Haga clic sería así:

Vue.JS proporciona una taquigrafía "@" en lugar de usar "V-ON" también.

Vue.JS no se detiene solo en escuchar el evento de clic y llamar a la función. También nos permitirá escribir directamente cualquier operación aritmética o cualquier cosa relacionada con JavaScript dentro de las comillas "". Tal como esto:

Vue.JS nos proporciona llamar al método o función en una instrucción JavaScript en línea, como se muestra a continuación:

Usando vue.Los controladores de eventos de JS, también podemos acceder al evento DOM, utilizando una declaración en línea, pasando el Vue.La variable "$ evento" de JS proporciona especialmente en el argumento del método, al igual que el ejemplo a continuación:

Vue.JS también nos proporciona llamar múltiples funciones o métodos. Podemos llamar a más de una función y separarlos por comas, como este ejemplo:

Vue.JS también proporciona modificadores de eventos.

Modificadores de eventos

A menudo necesitamos llamar a modificadores junto con los eventos. Entonces, vue.JS proporciona algunos de los siguientes modificadores:

.detener

Detendrá la transmisión del evento de clics.

.prevenir

Evitará que la página recargue o redirigirá.

.una vez

Activará el evento de clic solo una vez.

.captura

Se usa principalmente para agregar el oyente del evento.

También podemos encadenar los modificadores. Sin embargo, tenga en cuenta que el orden de los modificadores sí importa y afectará los resultados.

Conclusión

En este artículo, hemos cubierto todos los conceptos de manejo de eventos de clics desde Noob hasta Ninja Level. Hemos aprendido sobre las diferentes sintaxis de escritura de eventos de clics y las diferentes formas de usar V-on: haga clic Directiva proporcionada por Vue.JS para la facilidad de los desarrolladores y diferentes modificadores de eventos. Para un contenido más útil como este, relacionado con Vue.JS, sigue visitando Linuxhint.comunicarse.