组件化是Vue.js中的重要思想
他提供了一种抽象,让我们可以开发出一个个独立可复用的小组件来构造我们的应用。
任何的应用都会被抽象成一颗组件树。
组件化思想的应用:
有了组件化的思想,我们在之后的开发中就是要充分的利用他,尽可能的将页面拆分成一个个小的,可复用的组件。这样让我们的代码更加方便组织和管理,并且扩展性也更强
注册组件
组件的使用凤城三个步骤:
.创建组件构造器
.注册组件
.使用组件
通过代码注册组件
1.调用Vue.extend()方法创建组件构造器
2.调用Vue.component()方法注册组件
3.在Vue市里的作用范围内使用组件
这里的步骤都代表什么含义呢?
- vue.extend():
.调用Vue.extend()创建的是一个组件构造器
.通常在创建组件构造器时,传入template代表我们自定义组建的模板
.该模板就是在使用到组件的地方,要显示的HTML代码
2.Vue.component():
.调用Vue.component()是将刚才的组件构造器注册为一个组件,并且给它起一个组件的标签名称。
.所以需要传递两个参数:1.注册组件的标签名2.组件构造器
3.组件必须挂载在某个Vue实例下,否则他不会生效。
全局组件和局部组件
当我们通过调用Vue.component()注册的组件时,组件的注册是全局的
这意味着该组件可以再任意Vue实例下使用
如果我们注册的组件是挂在某个实例中,那么就是一个局部组件