Vue之组件注册

组件注册

组件名

---

组件名的命名方式有两种，一是帕斯卡拼写法，而是采用形如name-name（短横线分隔命名法）

//短横线分割法
vue.component('my-component-name',)

//帕斯卡拼写法
vue.component('MyComponentName',)

//因此在引用的时候
<my-component-name></my-component-name>
<MyComponentName></MyComponentName>
//都是可以接受的

全局注册

---

因为是全局注册的这就意味着可以用在任意创建新的Vue根实例模板中。（注意这里的全局注册意思不是注册了整个项目就可以使用的意思）。
例如：

Vue.component('name-a');
Vue.component('name-b');
Vue.component('name-c');

new Vue({
	el: '#app',
})

//----------------------------------------------------------
<div id = "app">
	<name-a></name-a>
</div>

局部注册

---

var ComponentA = { /* ... */ }
var ComponentB = { /* ... */ }
var ComponentC = { /* ... */ }

new Vue({
	el: 'app',
	components: {
		'component-a': ComponentA,
		'component-b': ComponentB
	}//这就意味着A B是同一级别的节点（个人见解）
})
//且值得注意的是局部注册于全局注册的不同就是注册组件不可互相嵌套

如果希望能够使得局部注册也可以嵌套使用，例如希望在 ComponentA 中使用 ComponentB 则需要这样注册

var ComponentA = { /* ... */ }

var ComponentB = {
  components: {
    'component-a': ComponentA
  },
}

模块系统

因为这个地方个人用的比较少，但是这个确实是有利于项目组件的管理。所以在后续的时间里边我会尽量的将其补全