vuejs2.0 directive

by robert chang

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.0.0-rc.3/vue.js"></script>
<div id="app">
  <demo :inputstr="propstr"></demo>

</div>

JavaScript

var lmixin = {
  components: { ca:{template: '<div>A  <button @click="destroyA">destroy A</button></div>',mounted:function(){console.log('A')},methods:{'destroyA':function(){this.$destroy(true);console.log('A destroyed')}}}, cb:{template: '<div>B</div>'}
}
}
Vue.component('demo',{
   template: '<div><cc></cc>{{ inputstr }}<ca></ca> <cb></cb> </div>',
   props: [ 'inputstr' ],
   mixins: [lmixin],
   components: { cc: {template: '<div>C</div>',mounted:function(){console.log('C')}}
   },
   mounted(){
      console.log(this.inputstr)
   }
})

new Vue({
  el: '#app',
  data: {
    propstr: 'hello this is a string with space in it!'
  }
  })