一)注册:
全局注册:
语法:Vue.component(name,obj或func);其中obj为配置对象,func是子类构造函数;
注意事项:
1),定义的组件可以直接在html页面书写;
2),必须在vue实例定义前定义组件;
局部注册:该组件只能存在特定的实例之中;
语法:new Vue({components:{组件:obj或func}});
二)数据传递:
组件间数据传递存在三种方式:props、组件通信、slot;
props:专门接受父组件传入的数据;
第一种声明方式:以数组形式声明;eg:props:["a",...];
第二种声明方式:对象形式(主要是用于props值的检验);
eg:props:{
A:string(Number,Boolean,Object,Function,Array),
B:[string,object],
C:{type:string,require:boolean,defalut:"en",validator:function(value){}}
}
父子间:
vm.$children:组件中的子元素;
vm.$parent:组件中的父元素;
vm:$oot:组件中的根元素;
以上三种都不太适合父子间通信,
ref与$refs:只能用在组件本身(内部),不能用于父子组件间通信。
父子间通信示意图:
父组件(发)-------(prop传递数据)-------子组件(收)
父组件(监听)------(自定义事件)---------子组件(发射)
发射:$emit(自定义事件[,数据]);
监听:$on(自定义事件,callback)或者v-on:自定义事件=“函数名”
兄弟组件间通信:可以用它们所在的vue实例作为总管,负责发射和监听。