l8l8
<div id="app">
        <div>{{pmessage}}</div> //父组件
        <child :message="pmessage"></child>//打开一个通道 绑定message 用来接受数据 类似于emit
</div>
     Vue.component(\'child\',{
          props:[\'message\'], //使用props 来接收信息
          template:\'<h1>{{message}}</h1>\' //需要暴露的信息
      });
     new Vue({
         el:\'#app\',
        data:{
           pmessage:\'123\' //父元素的值
        }
     });

props的使用。props可以是一个数组,也可以是一个对象。

let App = Vue.extend({ 定义自定义组件

template:\'\'\'<h1>hello world</h1>\'

})

Vue.component(\'my-app\',App);
let App = Vue.extend(\'child\',{   //局部定义组件
    template:\'<h1>hello world</h1>\'   
});
   new Vue({
         el:\'#app\',
        components:{  //
        my-app:APP,
        }
     });  
//==========================
    new Vue({
         el:\'#app\',
       data:{},
       components:{
       \'hello\':{
           template:\'<h1>hello world</h1>\' 
        }
       }
     });      

 

分类:

技术点:

相关文章: