## MVVM 是什么?
+ M 是modle 的
+ VM 是 连接 m 和v 的一种方式,让两个之间彼此有联系 监听m和v的
+ V 是
![图片alt](图片地址 ''图片title'')
![MVVM]('/img/MVVM的概念-这张图很值钱.png)
## 插值表达式的用法:
+ 两种方式,主要是用来渲染页面内容
+ 可以使用表达式直接使用以两个相互曝光的大括号{{name}}
+ 可以使用三元运算符来表达 例: {{age>=18 ? "已成年": "未成年"}} 注意: 三元运算符和if语句在这边不合适
## 插值表达式使用场景
1. 一般情况下使用的比较广泛,和v-text相比书写简单,
## v-text 使用场景
1. 渲染数据,直接用在标签上,把数据添加到标签上
2. 相比较插值表达式就有点麻烦
## v-html 使用场景
1. 容易受到XSS攻击,所以在用户提交表单切勿使用,只在可信内容使用
2. v-html在Model中如果有html标签会自动解析的
## v-bind 绑定的是什么
1. 可以绑定class属性名 v-bind: class = "{'类名': ture/false}" true 表示确认绑定 false表示不要这个属性
2. 因为在以后的工作中可能会用的比较多, 这个可以采用的简写方式 以冒号 : 代替 例: :class= '类名'
4. 可以通过在vue.js的网站查询[vue.js](https://cn.vuejs.org/)
## v-for 在v-for中数据和页面的内容是实时更新的
#### 只有这两种情况下不是实时更新
1. 当时用数组的length属性时不是实时更新
2. 在一种就是使用数组的角标时,也不是实时更新
##### 解决这两种情况的方法
1. 使用Vue.set(arr, index, newVal) arr是需要改变的数组,index是数组里面的项, newVal是改变后的值
2. Array.prototype.splice()
### 3. 注意 v-for必须结合key属性来使用,它会唯一标识数组中的每一项,未来当数组中的那一项改变的时候,它会只更新那一项,好处就是提升性能。注意key的值唯一,不能重复
##### 1,渲染数组的形式
1. v-for= 'item in 数组名' item表示每一项
2. v-for= '(item, index) in 数组名' index表示索引
#####2, 渲染对象的形式
1. v-for= 'value in 对象名' value表示对象的每一个值
2. v-for='(value,key, index) in 对象名' value表示对象的每一个值 key表示键
## v-on
1. v-on:click = '事件名'
2. ** 简写方式 @click = "事件名" **
v-on指令用来监听dom事件
使用方法:
1. 在标签的属性位置写上v-on:任意的事件类型="执行的函数"
2. 简写:@任意的事件类型="执行的函数" (推荐)
3. 通过执行函数添加参数
4. 通过执行函数中添加$event参数传递事件对象,注意只能是$event,并且不能加引号
5. 事件修饰符可以给事件添加特殊功能 .stop .prevent
6. 可以给和按键相关的事件添加按键修饰符 常用的有 .enter
## v-if 和v-show
1. v-if 和v-show是通过 布尔值来设置的,如果为true则显示,如果为false则 隐藏
2. v-if 是通过控制dom设置元素的隐藏或者显示
3. v-show是通过设置display: none的方式来控制显示还是隐藏
#### 4. 用法 : v-if在异步数据渲染的时候使用 .... v-show在页面有很多的dom元素时使用