vue基础（1）

1. 什么是vue.js

a)Vue.js是一套构建用户界面的渐进式框架。与其他重量级框架不同的是，Vue 采用自底向上增量开发的设计。Vue 的核心库只关注视图层，不仅易于上手，还便于与第三方库或既有项目整合。

2. 为什么学习流行框架

a)使用框架，能够提高开发的效率；
b)提高开发效率的发展历程：原生JS -> Jquery之类的类库 -> 前端模板引擎 -> 流行框架
c)能够帮助我们减少不必要的DOM操作；提高渲染效率；双向数据绑定的概念【通过框架提供的指令，我们前端程序员只需要关心数据的业务逻辑，不再关心DOM是如何渲染的了】

3. 框架和库的区别

a)框架：是一套完整的解决方案；对项目的侵入性较大，项目如果需要更换框架，则需要重新架构整个项目。
b)库（插件）：提供某一个小功能，对项目的侵入性较小，如果某个库无法完成某些需求，可以很容易切换到其它库实现需求。

4. MVC与MVVM的区别

a)MVC 是后端的分层开发概念;
M:  model模型层： 与数据库做交互
V： view 视图层： 逻辑处理和数据展示
C:  controller 调度层： 接收、响应返回数据
b)MVVM是前端视图层的概念，主要关注于视图层分离
M:  Model层：逻辑处理
V:  View 数据展示
VM：ViewModel 承上启下
1
2
3
4
5
6
7
8

5. Vue.js的代码结构

a)引入vue.js
b)写视图层，我们要展示的内容
c)实例化Vue()
data：存放数据
el：这个控制是哪块视图
methods：放我们的方法
1
2
3
4
5
6

6. v-bind界面元素属性值的绑定【绑定元素属性】

7. v-on

a)进行事件的绑定，我们用的最多的是click事件绑定
b)简写@
c)实现跑马灯的效果

8.事件修饰符

a).stop 阻止冒泡
b).prevent 阻止默认事件
c).capture 添加事件侦听器时使用事件捕获模式
d).self 只当事件在该元素本身（比如不是子元素）触发时触发回调
e).once 事件只触发一次
1
2
3
4
5

9. v-model数据双向绑定

a)作用：数据双向绑定
b)注意：绑定的是表单控件
实现了计算器功能

10. Vue中样式的使用

使用class样式:
a)数组
b)三木表达式
c)数组内置对象（对象的键是样式的名字，值是Boolean类型）
d)直接通过对象
使用内联样式
1.直接在元素上通过 :style 的形式，书写样式对象
2.将样式对象，定义到 data 中，并直接引用到 :style 中
3.在 :style 中通过数组，引用多个 data 上的样式对象
a)在data上定义样式
b)在元素中，通过属性绑定的形式，将样式对象应用到元素中

11. V-for和key属性

a)遍历数组，参数(item,index) in list
b)遍历对象，参数(value,key,index) in list
c)遍历数字，num in 10 
d)key在使用v-for的时候都需要去设置key
【唯一值，只能是字符串或数字，提高重排效率，就地复用】
1
2
3
4
5

12. v-if与v-show区别

a)区别：
i.v-if删除dom元素
ii.v-show设置display:none
b)应用场景：
i.v-if只修改一次的时候可以使用v-if
ii.v-show频繁切换的时候可以使用v-show
1
2
3
4
5
6