组件化开发指的是:根据封装的思想,把页面上可重用的 UI 结构封装为组件,从而方便项目的开发和维护。
每个 .vue 组件都由 3 部分构成,分别是:
其中,每个组件中必须包含 template 模板结构,而 script 行为和 style 样式是可选的组成部分。
vue 规定:每个组件对应的模板结构,需要定义到 节点中
主意:
vue 规定:开发者可以在
.vue 组件中的 data 必须是函数
vue 规定:.vue 组件中的 data 必须是一个函数,不能直接指向一个数据对象。
因此在组件中定义 data 数据节点时,下面的方式是错误的
data:{ //组件中,不能直接让data指向一个数据对象(会报错)
count:0
}
会导致多个组件实例共用同一份数据的问题,请参考官方给出的示例:
https://cn.vuejs.org/v2/guide/components.html#data-必须是一个函数
vue 规定:组件内的
让 style 中支持 less 语法
在
这是用户自定义的 Test.vue --- {{ username }}
123
![][1]
