usuario761100
Estoy creando una tabla usando Vue.js y quiero definir un onClick evento por cada fila que pasa contactID. Aquí está el código:
<tr v-for="item in items" class="static"
v-bind:class="{'evenRow': item.oddeven=='1', 'oddRow': item.oddeven=='0' }"
@click="addToCount('{item.contactID}')"
>
<td>{{item.contactName}}</td>
<td>{{item.recipient}}</td>
</tr>
Al hacer clic en una fila, está llamando addToCount(), que está funcionando. quiero pasar item.contactID a addToCount(). ¿Alguien podría sugerir la sintaxis correcta para esto?
Solo use una expresión Javascript normal, no {} o cualquier cosa necesaria:
@click="addToCount(item.contactID)"
si también necesita el objeto de evento:
@click="addToCount(item.contactID, $event)"
-
¡¡Agradable!! Justo lo que necesitaba saber
– Señor Eduardo
2 de febrero a las 18:21
-
el objeto de evento salvó el día ~
– Kurt Chun
2 de junio a las 3:43
Brian Glaz
Cuando usa directivas de Vue, las expresiones se evalúan en el contexto de Vue, por lo que no necesita envolver las cosas en {}.
@click es solo una abreviatura de v-on:click directiva por lo que se aplican las mismas reglas.
En su caso, simplemente use @click="addToCount(item.contactID)"
-
¿Qué pasa si el argumento que quiero pasar no se itera y se puede codificar, sino que está codificado como tal?
<a href="#" @click="switchRoom" class="rooms">Interview Room</a> <a href="#" @click="switchRoom" class="rooms">Green Room</a> <a href="#" @click="switchRoom" class="rooms">Bavarian Caviar Room</a> <a href="#" @click="switchRoom" class="rooms">Sky Room</a>y quería usar el contenido de texto de los elementos a en el método switchRoom?– Akin Hwan
19 de febrero de 2018 a las 21:58
-
@AkinHwan Si ya está codificado, solo envíe el texto como parámetro
@click="switchRoom('Sky Room')"– Brian Glaz
20 de febrero de 2018 a las 15:20
-
¿Qué pasa si no es propiedad de la instancia de vue? Por ejemplo, desea anular un clic en un gráfico y el gráfico se encuentra en una directiva vue pero no es en sí mismo vue. ¿Necesita llamar al evento de clic subyacente de alguna manera desde la función de anulación de clic de vue?
– matemáticas
18 de noviembre de 2020 a las 11:20
Tuve el mismo problema y así es como me las arreglo para pasar:
en tu caso tienes addToCount() Lo que es llamado. ahora para transmitir un parámetro cuando el usuario hace clic, puede decir @click="addToCount(item.contactID)"
en la implementación de su función, puede recibir parámetros como:
addToCount(paramContactID){
// the paramContactID contains the value you passed into the function when you called it
// you can do what you want to do with the paramContactID in here!
}
-
Gracias. Su respuesta es similar a la ya proporcionada por @Linus
– usuario761100
3 oct 2020 a las 23:51