vue.js Referenz Div-ID auf v-on: klicken

Question

Mit v-on:click Ich würde gerne eine Variable mit der ID des Div in Vue.JS setzen - wie beziehe ich das?

<div id="foo" v-on:click="select">...</div> 

<script> 
    new Vue({ 
     el: '#app', 
     data: { 
     }, 
     methods: { 
      select: function(){ 
       divID = this.id // ?? 
       alert(divID) 
      } 
     } 
    }) 
</script> 

Answer 1

Sie können Ihre Ereignishandler dem Ereignisobjekt $event verlängern. Das sollte Ihre Bedürfnisse anzupassen:

<div id="foo" v-on:click="select($event)">...</div> 

Die Veranstaltung wird in Javascript weitergegeben:

methods: { 
    select: function(event) { 
     targetId = event.currentTarget.id; 
     console.log(targetId); // returns 'foo' 
    } 
} 

Wie in den Kommentaren erwähnt, ist $event nicht unbedingt erforderlich, wenn nur dieses Argument verwenden. Persönlich bevorzuge ich es explizit zu schreiben, wenn ich seinen Wert in der Methode verwende, die ich anrufe.

jedoch niemand wird Sie stoppen die kurze Schreibweise vom Schreiben:

<div id="foo" @click="select">...</div>