模块化:是从代码逻辑的角度进行划分的
组件化:是从ui界面的角度进行划分的;前端的组件化,方便ui组件的重用
创建组件的方式三种:
第一:
1.使用extend创建组件模板对象
var com1=Vue.extend({
template:'这是使用Vue.extend创建的组件' });
2.// 使用Vue.component 注册组件
// 使用 Vue.component('组件的名称', 创建出来的组件模板对象)
Vue.component('mycon1',com1)
简化:Vue.component('mycom1', Vue.extend({ template: '
这是使用 Vue.extend 创建的组件
' }))
第二:
使用Vue.component 创建组件
Vue.component('mycon1',{ template:'<h2>使用Vue.component创建组件</h2>'})
第三:
定义私有组件:components
1.组件可以有自己是data属性
2.组件的data和实例的data有点不一样,实例中的data可以作为一个对象,但是组件中的data 必须是一个函数
3.组件中的data除了必须为一个函数之外,这个函数内部,还必须返回一个对象才行
4.组件中的data数据,使用方式和实例中大data使用方式安全一样。