How to get parent of clicked element in Vue.js

Question

How to get parent of clicked (this) element in Vue.js? In jQuery this looks like:

$(this).parents(':eq(2)').next('.press__news__nav--view').show();

Thanks!

Answer 1

It's not a good practice in Vue when you're trying to manipulate DOM directly. If you want to show/hide an element, you should use v-if or v-show directives.

Anyway, you can access event object like this:

new Vue({
  el: '#app',
  methods: {
    logme: function(event) { // a regular event object is passed by $event in template
      console.log(event.target.parentElement) // parent element
    }
  }
});

<script src="https://unpkg.com/vue/dist/vue.js"></script>

<div id="app">
  <div class="hello">
     <button @click="logme($event)">Click me</button>
  </div>
</div>