vue学习基础

1.v-for 指令

作用：列表渲染，遍历容器的元素或者对象的属性
语法： v-for = "(item,index) in items"

参数说明：
items 为遍历的数组
item 为遍历出来的元素
index 为索引/下标，从0开始 ；可以省略，省略index语法： v-for = "item in items"

2.v-bind

作用：动态为HTML标签绑定属性值，如设置href，src，style样式等。
语法：v-bind:属性名="属性值"
简化：:属性名=“属性值”

3.v-if & v-show

作用：这两类指令，都是用来控制元素的显示与隐藏的
v-if
语法：v-if="表达式"，表达式值为 true，显示；false，隐藏
其它：可以配合 v-else-if / v-else 进行链式调用条件判断
原理：基于条件判断，来控制创建或移除元素节点（条件渲染）
场景：要么显示，要么不显示，不频繁切换的场景

v-show
语法：v-show="表达式"，表达式值为 true，显示；false，隐藏
原理：基于CSS样式display来控制显示与隐藏
场景：频繁切换显示隐藏的场景

4.v-on

作用：为html标签绑定事件
语法：v-on:事件名="函数名"
简写为 @事件名=“函数名”

5.v-model

作用：在表单元素上使用，双向数据绑定。可以方便的 获取 或 设置 表单项数据
语法：v-model=“变量名”

6.Vue生命周期

（1）生命周期的八个阶段：每个阶段会自动执行一个生命周期方法(钩子), 让开发者有机会在特定的阶段执行自己的代码

（2）Vue生命周期典型的应用场景 ？
在页面加载完毕时，发起异步请求，加载数据，渲染页面。

7.Axios

介绍：Axios 对原生的Ajax进行了封装，简化书写，快速开发。

GET: 
axios.get(url).then((res)=>{…}).catch((err)=>{…})
POST: 
    axios.post(url,data).then((res)=>{…}).catch((err)=>{…})