SOURCE

console 命令行工具 X clear

                    
>
console
let tip = {
    template: '<h1> tip !!!</h1>'
}

let div1 = {
  template: '<div><a @click="open">open tip</a><a @click="close">close tip</a></div>',
  methods: {
    open() {
      this.$root.$emit('open')
    },
    close() {
      this.$root.$emit('close')
    }
  }
}


Vue.component('tip', tip)
Vue.component('div1', div1)


// let app = new Vue({
//     el: '#app'
// })

let app = new Vue({
    template: '<div><tip v-show="show"/><div><div1/></div></div>',
  	data() {
      return {
        show: false
      }
    },
  	methods: {
      open() {
        this.show = true
      },
      close() {
        this.show = false
      }
    },
    created() {
      this.$on('open', function(){
        this.open()
      })
      this.$on('close',function(){
        this.close()
      })
    }
}).$mount('#app')
<script src="https://cdn.bootcss.com/vue/2.2.6/vue.min.js"></script>


<div id="app"></div>