Categories
Vue Answers

How to get the element that is being called by an event with Vue.js?

Spread the love

Sometimes, we want to get the element that is being called by an event with Vue.js

In this article, we’ll look at how to get the element that is being called by an event with Vue.js.

How to get the element that is being called by an event with Vue.js?

To get the element that is being called by an event with Vue.js, we can use the e.target property in the event handler.

For instance, we write

<template>
  <div>
    ...
    <li @click="onClick">Trigger a handler</li>
    ...
  </div>
</template>

<script>
export default {
  methods: {
    onClick(e) {
      const clickedElement = e.target;
    },
  },
};
</script>

to set the click event handler to onClick with @click="onClick".

Then we get the element that’s clicked in onClick with the e.target property.

e is the event object that’s set when we click on the element.

Conclusion

To get the element that is being called by an event with Vue.js, we can use the e.target property in the event handler.

By John Au-Yeung

Web developer specializing in React, Vue, and front end development.

Leave a Reply

Your email address will not be published. Required fields are marked *