No tienes acceso a esta clase

¡Continúa aprendiendo! Únete y comienza a potenciar tu carrera

Event handling

19/37
Recursos

Aportes 6

Preguntas 0

Ordenar por:

Los aportes, preguntas y respuestas son vitales para aprender en comunidad. Regístrate o inicia sesión para participar.

Podemos usar la directiva v-on para escuchar eventos DOM y ejecutar algunos JavaScript cuando se activan.

Ejemplo:

<div">
  <button v-on:click="contador += 1">Agregar + 1</button>
  <p>Se ha hecho click {{ contador }} veces.</p>
</div>

También se permite colocar el nombre de un método al que te gustaría llamar.
Recuerda que se puede abreviar v-on con @ (v-on:click = @click)

Yo felicito al profe porque es muy bueno, y el curso es muy completo, pero enserio me da agriera el zoom que tiene en su pantalla, se me está dificultando mucho enfocarme

Pueden encontrar más modificadores de eventos en la documentación oficial de Vue:
.
https://v3.vuejs.org/guide/events.html#event-modifiers
.
Uno muy útil suele ser el @click.prevent para prevenir el comportamiento por defecto de las aplicaciones 😄
.
Otra cosa interesante es que así como podemos pasarle expresiones JavaScript, también podemos pasarle nombres de métodos que podemos escribir aparte para que los mismos sean ejecutados al suceder dicho evento 😄
.
Dejo el código de esta clase:
.
https://github.com/RetaxMaster/vue3-platzi-commerce/tree/f718f7fe60106ad846ee5060569f3ef5fc9f200e

Les dejó un Handling Events de Digital Ocean donde complementa este apartado.
En él podemos observar:

  • Event Modifiers
  • Key Modifiers

Si stock es 0

<button :disabled="product.stock===0" @click="product.stock -= 1">{{ product.stock > 0 ? "Añadir a Carrito" : "Agotado"}}</button>

Excelente clase