Vue.js 2 Examples of difficulties in use--sub-components, slots, dynamic components, event monitoring

A case of beating. ：）

<! DOCTYPE html>Vue.component (' My-slot ', {Template:‘<div> <div class= "title" > <slot name= "title" ></slot> </div> <div class= "Content" > <slot name= "Content" ></slot> </div> </DIV&G t;‘    })    varBus =NewVue (); varVM =NewVue ({el:"#app", data: {currentview:' Home ', Title:"This is a title", Content:"This is the content"}, components: {home: {Template:‘<div> <p>Home</p> <ul> <li v-for= "item in Items" > {{ Item}} </li> </ul> </div>‘, Data:function() {            return{items: []}}, active:function(done) {varthat = This; SetTimeout (function() {That.items= [1, 2, 3, 4, 5];            Done (); }, 1000}}, List: {Template:' <div>List</div> '}, Detail: {Template:' <div>Detail</div> '}, Compa: {Template:‘<div> <input type= "text" v-model= "name"/> <button @click = "Create" > Add </bu Tton> </div>‘, Data:function() {            return{A:""}}, methods: {Create:function() {bus. $emit (' Create ', {name: This. name});  This. Name= '; }}}, COMPB: {Template:‘<ul> <li v-for= "item in Items" >{{Item.name}} </li> </ul>‘, Data:function() {            return{items: []}, mounted () {varthat = This; Bus. $on (' Create ',function(data) {That.items.push (data); })          }        }      }    })    </script>
Vue.js 2 Examples of difficulties in use--sub-components, slots, dynamic components, event monitoring