0、写在前面
经过一段时间学习，感觉vue的数据驱动的思想真的挺好，简单记录下学习笔记，方便日后查阅、、、
1、基础
MVVM即Model<--->ViewModel<--->View
{{ data }}，传入文本
v-html="data"
指令系统：
v-bind:class="{ 'class1': use }"，动态更新属性值，可简写为:class="{ 'class1': use }"
v-on:click="doSomething"，事件监听器，可简写为@click="doSomething"
条件循环
v-if，v-else-if，v-else，v-for
计算属性，跟普通方法比有缓存
以函数形式写在computed内
v-model，主要用于form表单，实现了DOM和数据的双向绑定，任意改变一方，另一方跟着改变
component（组件），可以子组件可以挂父组件
slot，写在子组件中，如果父组件有内容传入则替换为传入内容
vue.js编译时解析为virtual DOM
object-->render-生成虚拟节点->create Element（基于虚拟节点创建DOM节点）-状态更新后，进行对比->patch（更新DOM）
2、生命周期，钩子函数
创建期间的生命周期函数：
beforeCreate：实例刚在内存中被创建出来，此时，还没有初始化好 data 和 methods 属性
created：实例已经在内存中创建OK，此时 data 和 methods 已经创建OK，此时还没有开始 编译模板，常在此时发送ajax初始化全局页面，不宜过多，否则会白屏时间长
beforeMount：此时已经完成了模板的编译，但是还没有挂载到页面中
mounted：此时，已经将编译好的模板，挂载到了页面指定的容器中显示，常在此时发送ajax初始化局部组件页面
运行期间的生命周期函数：
beforeUpdate：状态更新之前执行此函数， 此时 data 中的状态值是最新的，但是界面上显示的 数据还是旧的，因为此时还没有开始重新渲染DOM节点
updated：实例更新完毕之后调用此函数，此时 data 中的状态值 和 界面上显示的数据，都已经完成了更新，界面已经被重新渲染好了！不可在此时操作数据，否则会进入死循环
销毁期间的生命周期函数：
beforeDestroy：实例销毁之前调用。在这一步，实例仍然完全可用。可做删除提示，例如你确认删除xx吗
destroyed：Vue 实例销毁后调用。调用后，Vue 实例指示的所有东西都会解绑定，所有的事件监听器会被移除，所有的子实例也会被销毁。 这时已经无法操作任何东西了
3、常用插件
webpack，打包器，模块化书写，打包后输出
v-router，前端路由，实现SPA（单页面应用）的基础
vuex，用于组件之间的数据传递
axios，发送接收ajax请求
element-ui，vue版的bootstrap，功能更强，更炫
4、模块化开发常用命令
创建webpack模板的项目
vue init webpack my-project
下载package.json中的依赖包
npm install
启动项目
npm run dev
5、一些问题
为什么要使用Vue？
传统的jQuery，直接操作DOM，代码写多了难以维护
Vue只关心数据，数据驱动DOM，更方便的模块化开发
SPA的优缺点？
优点：所有页面都在同一个HTML页面中，后续操作开销较小
缺点：由于页面内容都由js生成，无法被搜索引擎收录，不利于SEO
v-if和v-show的区别?
v-if是创建新的DOM，更大的开销，适用于切换不频繁的场景
v-show是控制css切换，更小的开销，适用于切换频繁的场景