Vue组件部分

组件

解释:实现应用中局部功能代码和资源的集合

需求:尽可能拆分的细致以做到高复用率

  • 非单文件组件:
    一个文件中包含N个组件
  • 单文件组件:
    一个文件中包含一个组件(开发项目中经常用)

一般情况下组件的三步走:

  1. 创建组件
  2. 注册组件
  3. 使用组件(使用的是组件标签)

代码内容及注意事项:


//创建组件
const 中转的变量名 = Vue.extend({方法体})

new Vue({
el:’#root’,
//注册组件(局部注册)
components:{
组件名:中转的变量名
}
})

//使用时在 root.div 中直接
<组件名/>

Ps:

  1. 编写组件时不把东西写死(不写el配置项,最终所有的组件都要被同一个vm管理,决定组件服务于哪个容器)
  2. 编写组件时Data需要使用函数式即 data(){} 可以当做对象去使用
  3. 组件名和中转变量名最好一致