创建vue2项目

可能用到的命令行们

vue create 项目名称 // 创建项目 cd 项目名称 // 只有进入项目下，才能运行 npm run serve // 运行项目 D: //切换盘符 cd .. // 返回到上一级目录 clear // 清空终端

更改 Vue项目的端口配置

基础语法

项目创建完成之后，会有一个组件HelloWorld.vue，这个组件是已经配置好的，可以直接在上面写代码来运行。

首先vue分成三个板块， 必不可少的就是template和script板块，前者写HTML代码，后者配置将组件导出需要的值。

{{属性值}}可以动态得到data中配置的属性值；

使用v-on:xxx或 @xxx 绑定事件,其中xxx是 事件名, 例如 @click；

methods中配置方法，computed中配置计算属性，也是写成一个方法的样子，返回运算结果，可以直接用{{方法名}}来执行；

# v-model 用于收集表单数据，=“属性名”则该属性可以获取到表单组件的数据，有三个修饰符—— lazy : 失去焦点再收集数据； number:输入字符串转为有效的数字； trim:过滤掉首尾输入的空格

条件渲染——

条件渲染有 v-if v-show  # v-if 写法:  v-if="表达式"  v-else-if="表达式"  v-else="表达式" 适用于: 切换频率较低的场景 特点: 不展示的DOM元素 直接被移除----------------------------  # 注意 : v-if 可以和 v-else-if, v-else 一起使用,但要求结构不能被"打断"  # v-show 写法:v-show="表达式" 适用于: 切换频率较高的场景 特点:不展示的DOM元素未被移除,仅仅是使用 display:none 隐藏掉-------------- # 注意: 使用v-if时 元素可能无法获取到,而使用v-show 一定可以获取到