CODEWITHSUNDEEP
vue.jsvuejs2clickvuetify.js
user4671351
user4671351

Reputation:

Unable to get ID of clicked button with Vuetify

Markup:

<div id="app">
  <v-app dark>
    <v-btn id="test" @click="clickMe">
      Click me
    </v-btn>   
  </v-app>
</div>

Script:

Vue.use(Vuetify);
var vm = new Vue({
  el: "#app",
  methods: {
    clickMe(e) {
      alert(e.target.id);
    },
  },
});

My expectation is that clicking the button with the ID test would trigger the clickMe function, get the target ID (test), and alert it. Instead, I just get an empty alert window. Can someone explain where my code is failing?

Here is a fiddle: https://jsfiddle.net/f96retyv/

Upvotes: 1

Views: 2582

Answers (1)

Bill Criswell
Bill Criswell

Reputation: 32921

You likely want currentTarget instead of target. It looks like Vuetify wraps your content in a <div> for whatever reason so target is actually that (since it's the element that initiated the event on the button). currentTarget will always give you the element the event listener is attached to.

enter image description here

Upvotes: 3

Related Questions