【序号】表示后期插入的知识点~
1、Hello World
2、双向绑定
语法：v-model
简介：v-model 是一个模板指令 input里面value的内容输入什么，下面content的内容就会显示出来。
3、数据绑定
语法：{{}}
【1】、属性绑定
语法：v-bind ~ :
简介：title='title' 后面的title不是个字符串 而是js的表达式 (new 实例下面的title）。
4、MVP & MVVM
4.1、MVP
4.2、MVVM
Ps：VM层属于Vue层（数据自动绑定），面向数据开发；而传统的MVP中的P层主要是面向DOM开发；用MVVM模式可以减少30%的代码量甚至可以达到70%。
5、组件
5.0、Vue组件 & Vue实例
在Vue里 ，每一个Vue组件，都是一个Vue实例。
Vue实例有的功能，Vue组件都同样拥有。
如果一个vue实例里面没有定义template，那么这个实例会把它对应的挂载点下的所有内容当作模板。
5.1、全局组件（注释部分） & 局部组件
5.2、组件即实例（new Vue({})）
5.3、组件定义的新标签，有时不能直接使用，比如：
Ps：一般情况下，父组件可以传递数据到子组件（单向），子组件不能修改从父组件而来的变量，不过可以通过data临时变量来传递到父组件。
【4、父子组件通信过程】
（1）父组件通过prop向子组件传值，子组件获得父组件传来的内容和索引。
（2）子组件通过$emit向父组件抛出触发事件名称（delete）和触发事件的list索引值。
（3）父组件通过监听对应事件名称（@delete）触发函数handleDelete。函数通过子组件抛出的索引值对应删除list。
5.7、组件参数检验 + props + 非props 特性
props：不仅可以用数组来接收，也可以用对象来接收；渲染后不会显示content=”xxx”。
非props：可以直接操作要显示的数据，渲染后会显示content=”xxx”。一般非props不常用。
5.8、组件绑定原生事件
传统方式：
Ps：emit针对自定义事件；而在组件内部 @click 属于原生事件。
简写方式：
5.9、非父子组件通信
5.10、内容插槽
5.11、作用域插槽
Ps：在这里的和slot-scope是固定写法。
5.12、动态组件 & v-once 指令
Ps：注释的代码性能更好，因为不需要每次都删除再增贴。
5.13、template 属性
Ps：挂载点：指的是el标记的。
模板：既可以写在挂载点内部，也可以写在js的template里面。
挂载点里面的内容称之为模板。
6、生命周期
Ps：椭圆白底矩形的方法是不用写在methods里面的，与methods同层次级别。
7、计算属性（一）
语法：computed:{}
提示：
7.1、支持缓存，只要跟他的相关值改变才会更新，否则一直使用缓存。
7.2、若一个业务逻辑可以用watch、methods、computed实现的话，优先选择computed，因为代码少，而且性能最好。
7、计算属性（二）
语法：computed:{
xxx:{
set: function(){},
get: function(){}
}
}
提示：
7.1、支持缓存，只要跟他的相关值改变才会更新，否则一直使用缓存。
7.2、set函数里面需要自己split来分割分别赋值。
8、监听器
语法：watch:{}
提示：
8.1、支持缓存，只要跟他监听的变量改变才会更新。
【2】计算属性 & 监听器
9、样式绑定
9.1、:style
9.2、:class
Ps：value用数组或{}（对象）来表示，用对象时，注意用驼峰命名法，比如：font-size => fontSize。
10、条件渲染
10.1、v-show
提示：
10.1.1、如果为false，相当于display:none; 和v-if一样会整个DOM都消失了；从性能上来看v-show性能更好。
10.2、v-if / v-else-if / v-else
提示：
10.2.1、中间不能有其他与if/else不相关的元素，if/else必须紧接着一起。
10.3、key
提示：
10.3.1、因为Vue会尽可能的用已加载好的结构来提高性能，但是有时也会出现BUG，比如：input元素，此时，就要用key来区分，避免乱用别人的DOM（脏数据）。
【3、v-if & v-show】
- v-if 为false时，DOM元素在HTML里不存在（原来存在的话，现在就被删除），自然而然在流结构上面不存在。
- v-show 为false时，DOM元素在HTML里存在，但是 display:none 而且在流结构上面仍然属于不存在。
11、列表渲染
语法：v-for=”(item, index, key) of list”
语法：:key=”item.id”（不推荐使用”index”，因为性能不好）
提示：
11.1、使用下标改数据，数据成功改变，但不会实时渲染；只有调用上面注释的API(变异方法)改变数据或者改变引用地址（赋值新的对象或数组）才会实时渲染。
11.2、相当于小程序中的可节省一个
11.3、Vue.set 或 vm.$set 也可以实现实时渲染
【4、for of & for in】
ES6 - for of & for in 区别
12、CSS动画原理
Ps1：如果属性name=”xxx”，则class为“.xxx-enter-active”其他类似，默认为“.v-…”。
Ps2：leave：准备离开时调用；enter：准备出现时调用。
13、Animate.css库
Ps：支持自定义动画。
Ps：支持自定义class。
Ps：必须使用自定义的模式，如“enter-active-class”来使用；并且加上“animated”，剩下的效果自己选择。其实Animate.css库只是@keyframes的封装罢了。
14、Animate.css & 自定义同时使用
Ps1：appear 出场时调用。
Ps2：type 选择以自定义的时间为基准。
Ps3：:duration 固定出现和消失的基准时间，若一样，则可以“:duration=‘毫秒’”。
15、结合动画Velocity.js使用
传统方式：
Ps：leave类似。
Velocity.js方式：
16、多个元素或组件的过渡
方法一：
方法二：
17、列表过渡
Ps：高亮选中的为的原理部分。
18、动画封装
19、项目初始化
Ps：项目更新到码云上。
20、单页应用 & 多页应用
Ps：单页应用，把当前页DOM删除掉，再把需要的渲染出来。
21、axios
URL代理
22、keep-alive
22.1、多了一个 activated 生命周期
22.2、多了一个 deactivated 生命周期
22.3、exclude 属性
实战：每个地方的首页是不一样的，如果我第一次选A地，发送一次请求；如果第二次还选A地，不发送请求；如果选非A地，发送一次请求。
23、Vue + Vue-Cli + Webpack + npm
build 目录下放置的是项目的webpack配置文件，可以不动
config 是针对线上环境和开发环境的配置文件，也可以不动
node_modules 指的是项目的依赖
src 指的是源代码放置的目录
static 放置的是静态的资源
src中的main.js文件是整个项目的入口文件
vue-cli 提供了一种新的vue的编码语法：单文件组件（一个.vue文件中包含了一个组件里必须的所有内容）
vue-cli 的优势：
23.1、可以使用es6。
23.2、一个组件是一个.vue的文件所定义的，实现了组件的封装。
（在安装该工具之前需要安装npm和node）
24、单文件组件开发模式
- template下面只能有一个最外层根标签。
- 在v-cli脚手架中，data不再是一个对象，而是一个函数。
