Obtenez l’élément appelant avec vue.js

Je souhaite que l’élément html appelant dans vue.js le modifie via jQuery. Pour le moment, je donne à chaque élément le nom de la classe + l’indice et je l’appelle ensuite via jQuery, mais cela ressemble à un hack fou.

Ce que je veux faire:

new Vue({ el: "#app", data: { testFunction : function(element) { $(element).doSomethingWithIt(); //do something with the calling element } } });

C’est l’élément appelant:

 Test

Que puis-je passer dans la fonction pour obtenir l’élément div ou existe-t-il un autre moyen d’y parvenir?

Vous pouvez obtenir l’élément de l’événement comme ceci:

 new Vue({ el: "#app", methods: { testFunction : function(event) { $(event.target).doSomethingWithIt(); } } });

Et alors:

 Test

Ou (si vous voulez passer un autre paramètre):

 Test

[démo]

Vous faites le mauvais chemin.

 new Vue({ el: "#app", data: { testFunction : function(element) { $(element).doSomethingWithIt(); //do something with the calling element } } });

data est l’état ou le stockage des données pour votre application.

vous devez créer un object de methods pour vos méthodes

 new Vue({ el: "#app", data: { }, methods: { testFunction : function(element) { $(element).doSomethingWithIt(); //do something with the calling element } } });

Vous voulez que v-el puisse exécuter jQuery dessus. Par exemple:

 Test

puis:

 // as noted by @vistajess // your function should be in the methods object // not the data object methods: { testFunction : function() { $(this.$els.myElement).doSomethingWithIt(); } }