<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>\' } } });