jackdizhu Vue
vue
            <div id="vue">
                <span v-for="item in items">
                  {{ item.name }}
                </span>
                <span v-show="show2" @click="showHide">
                  ( span v-show 02 ....) --> component01
                </span>
                <component01 message="hello" :_show="show"></component01>
            </div>

            <script>
            (function () {
              'use strict';

              Vue.component('component01', {
                props: ['message','_show'],
                template: '<div v-show="_show">A custom component {{message}}! -> {{_show}}</div>'
              });
              var app = new Vue({
                el: '#vue',
                data: {
                  show: true,
                  show2: true,
                  items: [
                    {name: 'aaa'},
                    {name: 'bbb'},
                  ],
                  message: 'ssssssss'
                },
                methods: {
                  showHide: function (){
                    var is = this.show == true;
                    if(is){
                      this.show = false;
                    }else{
                      this.show = true;
                    }
                  }
                },
              });

            }());
            </script>