How to hide div with Vue.js

As @Ferrybig stated, Vue only has control over the element it’s bound to and all of those child elements. Your hide element is outside the element bound to Vue (app) so Vue cannot change it.

With a slight change, your code works fine:

new Vue({
el:'#wrapper',
data:{
    seen: true
}
});
    <script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<div id="wrapper">
  <div id="app" v-on:click="seen = !seen" class="control">
      <p>click app</p>
  </div>
        
  <div v-if="seen" id="hide">
      <p>hide me </p>
  </div>
</div>

Leave a Comment

Hata!: SQLSTATE[HY000] [1045] Access denied for user 'divattrend_liink'@'localhost' (using password: YES)