JAVASCRIPT

vue hide

<!-- there are two cases: -->
<!-- do you wanna keep it in the dom? -->
<div v-show="someBoolean">
  v-show
</div>

<!-- or remove it -->
<div v-if="someBoolean">
  v-if
</div>

hide component on click vue

<script src="https://cdn.jsdelivr.net/npm/vue@2.5.13/dist/vue.js"></script>

<div id="app">
  <button v-on:click="isHidden = true">Hide the text below</button>
  <button v-on:click="isHidden = !isHidden">Toggle hide and show</button>

  <h1 v-if="!isHidden">Hide me on click event!</h1>
</div>

var app = new Vue({
  el: '#app',
  data: {
    isHidden: false
  }
})

hide component vuejs

//App.vue
<template>
  <div id="app">
    <div class="routing" v-if="this.$route.path !== '/'">
        <router-link to="/">Login</router-link>
        <router-link to="/home">Home</router-link>
    </div>

    <router-view></router-view>
  </div>
</template>

hide element vue

 // to hide element in vue.js use v-if
  <div v-if="seen" id="hide">
      <p>hide me </p>
  </div>
</div>

new Vue({
data:{
    seen: true
}
});