Vuejs get attribute from button

Question

I would like to have attribute tblid from button element, when click event is triggered.

I was reading questions like this, but it's not working for me -> example below.

What seems so strange to me is that e.target or e.currentTarget returns the element with all attributes, including tblid. Why is so hard in vuejs to get those attributes from element?

Please note: I know I can create component and use props on that component. But I really don't want to create component for every html element like button, label, input ...

html:

<div id="app">
      <button tblid="tbl1" @click="buttonClick($event)">
        Button 1 tbl1
      </button>
    </div>

app.js:

new Vue({
  el: "#app",
  methods: {
      buttonClick(e){
          debugger;
      }
  }
});

Vue does not blindly pollute the DOM. Adding every single attribute of a VNode element to the DOM element would decrease the performance of the DOM considerably. — Ohgodwhy
– Ohgodwhy, Commented Dec 10, 2019 at 9:18

arm · Accepted Answer · 2019-12-10 09:13:41Z

1

If you want the value of tblid you could just send that as parameter in the even listener function instead of using the event object.

<button tblid="tbl1" @click="buttonClick('tbl1')">
    Button 1 tbl1
</button>

answered Dec 10, 2019 at 9:13

arm

1451 silver badge5 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

FrenkyB Over a year ago

Getting attribute is not possible?

arm Over a year ago

If you really want to you could try by adding a data-attribute somethine like data-tblid and in the elements object you can access like evt.target.dataset.tblid

arm Over a year ago

well I think adding the parameter directly to the event listener might be more vue style, both as long as both methods work its okay to use whichever you prefer I guess.

FrenkyB Over a year ago

Thanks for answers. You were very helpful - I've also discovered that I can use e.currentTarget.getAttribute('attr_name').

Collectives™ on Stack Overflow

Vuejs get attribute from button

1 Answer 1

4 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related