1、什么是Vue.js
1、Vue.js 是目前最火的一个前端框架，React是最流行的一个前端框架
2、
3、
2、框架和库的区别：
框架：是一套完整的解决方案；对项目的侵入性较大，项目如果需要更换框架，则需要重新架构整个项目。
库（插件）：提供某一个小功能，对项目的侵入性较小，如果某个库无法完成某些需求，可以很容易切换到其它库实现需求。
3、MVC和MVVM图解：
4、Vue.js初体验：
Document {
{ msg }}
第一步：引入vue-2.4.0.js文件
第二步：创建vue实例
第三步：在页面中利用插值表达式渲染数据
5、Vue.js详细介绍：
(1)、插值：
#文本：
数据绑定最常见的形式就是使用“Mustache”语法 (双大括号) 的文本插值：
v-html 指令： 1、{ {}}：在显示数据时会出现闪烁问题（闪烁就是在数据渲染出来之前会显示一些其他字符）；而v-text和v-html则不会出现闪烁问题2、{ {}}：不会替换标签原本存在的数据，如果标签原本存在数据，则将拼接后的结果进行显示；而v-text和v-html则会覆盖页面原有的数据3、{ {}}和v-text不会解析msg中的标签，会原样输出；而v-html则会将msg中的标签解析输出
代码：
Document ++++++++ {
{ msg }} ----------==================
{ {msg2}}1212112
效果图：
（2）、属性和事件绑定：
v-bind:属性绑定，可以简写为:
v-on:事件绑定，可以简写为@:
代码：
v-bind和v-on的学习
效果图：
（3）、事件修饰符：
.stop 阻止事件冒泡
.prevent 阻止默认行为
.capture 实现捕获触发事件的机制
.self 实现只有点击当前元素时候，才会触发事件处理函数
代码：
（4）v-model双向绑定：
前面学习了v-bind可以用于绑定属性，v-model的作用也是用于绑定数据，v-bind是单向数据绑定，从M到V，而v-model是双向数据绑定既可以从M到V，也可以从V到M。
Document { { msg }}
注意： v-model 只能运用在 表单元素中，因为只有表单元素才可以在页面上进行修改
（5）、vue中的样式：
Class样式：
1、对象语法：
我们可以传给 v-bind:class 一个对象，以动态地切换 class：
<div v-bind:class="{ active: isActive }"></div>
2、数组语法：
我们可以把一个数组传给 v-bind:class，以应用一个 class 列表：
<div v-bind:class="[activeClass, errorClass]"></div>
内联样式：
1、对象语法：
<div v-bind:style="{ color: activeColor, fontSize: fontSize + 'px' }"></div>
2、数组语法：
我们可以把一个数组传给 v-bind:class，以应用一个 class 列表：
<div v-bind:class="[activeClass, errorClass]"></div>
代码：
Document 这是一个很大很大的H1，大到你无法想象！！！
这是一个很大很大的H1，大到你无法想象！！！
这是一个很大很大的H1，大到你无法想象！！！
这是一个很大很大的H1，大到你无法想象！！！
这是一个很大很大的H1，大到你无法想象！！！
效果图：
未完待续。。。