id div tham chiếu vue.js trên v-on: nhấp vào

Question

Sử dụng v-on:click Tôi muốn đặt biến có id của div trong Vue.JS - làm cách nào để tôi tham chiếu điều này?

<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

Bạn có thể mở rộng trình xử lý sự kiện của mình với đối tượng sự kiện $event. Điều đó sẽ phù hợp với nhu cầu của bạn:

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

Sự kiện này được truyền lại trong javascript:

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

Như đã đề cập trong các ý kiến, $event không đúng cần thiết, khi sử dụng chỉ lập luận này. Cá nhân tôi thích viết nó một cách rõ ràng, khi tôi đang sử dụng giá trị của nó trong phương pháp tôi gọi.

Tuy nhiên, không ai sẽ ngăn chặn bạn viết các ký hiệu ngắn:

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