v-on:click and event triggering on inner elements

Question

I have a list of tabs set up with the following markup:

<li v-on:click.stop="changeTab()" id="bookings">
    <i class="fa fa-scissors" aria-hidden="true"></i> <span>Bookings</span>
</li>

The changeTab() method is:

changeTab: function() {
    window.location.hash = this.activeTab = event.srcElement.id;
}

The issue here is that if I click on the inner elements, i / span, then it sets the incorrect ID (none) and its the srcElement. Is there a way to now allow this to happen? Can I make the wrapper the only click that is listened to?

Manav Mandal · Accepted Answer · 2017-10-04 09:52:29Z

2

use event.currentTarget.id instead of event.srcElement.id

answered Oct 4, 2017 at 9:52

Manav Mandal

3251 gold badge2 silver badges7 bronze badges

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

Collectives™ on Stack Overflow

v-on:click and event triggering on inner elements

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related