JSFiddle - React, Tailwind, and code Playground

by sandfresh

HTML

<div id="app">
 

<blog-post :props-Title="52">Logged in as {{ user.name }}</blog-post> 
<child>
      <template slot-scope="user"  >
      {{user}}
      </template>

 </child>
</div>

Vue

props: {
  title: "GG"
 
}
 
 Vue.component('blog-post', {
  props: ['propsTitle'],
  template: `
  <h3>
  {{ propsTitle }}
  <slot></slot>
  </h3>`
})
 Vue.component('child', {
  data: function(){
    return {data:['zhangsan','lisi','wanwu','zhaoliu','tianqi','xiaoba'],name:"geroge"
    
    }
  },
  template: `
  <div class="child">
  <h3>这里是子组件</h3>
  <slot  v-bind:datas="data">
 
  </slot> 
  </div>`
})

new Vue({
  el:'#app',
  data:{
  	props:{
     title:"gg2333333"
    },
    user:{
    	name:"smith"
    },
    data: ['zhangsan','lisi','wanwu','zhaoliu','tianqi','xiaoba']
  }
});