一、学习内容
1、vue组件
组件(component) 是 Vue.js 最强大的功能之一。 Vue 中的组件化开发就是把网页的重复代码抽取出来 ,封装成一个个可复用的视图组件,然后将这些视图组件拼接到一块就构成了一个完整的系统。这种方式非常灵活,可以极大的提高我们开发和维护的效率。 2、vue组件构成 组件就是对局部视图的封装,每个组件包含了 为了能在模板中使用,这些组件必须先注册以便 Vue 能够识别。 有两种组件的注册类型:全局注册和局部注册 3、组件命名 可使用驼峰(camelCase)或者横线分隔(kebab-case)命名方式 但 DOM 中只能使用横线分隔方式进行引用组件 建议使用驼峰方式,适用性更强,DOM中使用组件时要转换成短横线方式。 4、父子组件 在一个组件中又定义了其它组件就是父子组件 其实局部组件就是最简单的父子组件, 因为我们说过可以把Vue实例看做是一个大组件 我们在Vue实例中定义了局部组件, 就相当于在大组件里面定义了小组件, 所以局部组件就是最简单的父子组件 4.1、如何定义其他父子组件 前面我们说过, 自定义组件中可以使用data, 可以使用methods. 当然自定义组件中也可以使用components 所以我们也可以在自定义组件中再定义其它组件 4.2、父子组件数据传递 在Vue中子组件是不能访问父组件的数据的, 如果子组件想要访问父组件的数据, 必须通过父组件传递 如何传递数据
props注意点:props 只用于父组件向子组件传递数据(单向)。
只有在props中声明的变量子组件才能使用。
|