vue 组件

组件:页面上的每一个部分都是组件

三部分

1、结构 template

2、样式 style

3、逻辑 script

 

组件作用：

复用

 

 

封装---->nav

 

function nav(){

<ul>

<li>首页</li>

<li>首页</li>

<li>首页</li>

</ul>

}

 

nav()

 

分模块

A 个人信息模块 商品查询模块

 

B 商品列表模块 评论模块

 

 

 

模块--->包含组件

 

 

 

组件创建

全局组件

Vue.component();

 

 

局部组件

components();

 

 

参数1：组件的名称

参数2：组件的配置项

 

 

组件的配置项：

new Vue这个里面有什么参数 那么组件的配置项中就有什么参数 包含生命周期

 

组件内部多了一个属性

template

 

组件内部的data不在是一个对象 而是一个函数

 

使用

直接将组件的名称当做标签使用即可

 

 

组件名称首字母必须大写

 

 

 

脚手架的使用

 

安装

3.0 cnpm install @vue/cli -g

 

2.9.3 cnpm install vue-cli -g

 

创建项目

3.0 vue create <项目名称>

 

2.9.3 vue init webpack <项目名称>