1、导入vue的包
<script scr="lib/vue.js">2、创建一个Vue实例，当我们导入包之后，在浏览器内存中就多了一个Vue的构造函数
var vm = new Vue({})3、el:表示当前我们new的这个实例，要控制页面上的哪个区域
var vm = new Vue({ el:'#app', })4、data属性中，存放的是el中要使用到的数据
var vm = new Vue({ el:'#app', data:{ msg:'Hello Word', } })5、**上面msg的是通过vue提供的指令，可以很方便的将数据渲染到页面上，程序员不再手动的操作DOM元素，而且前端的VUE等框架不提倡我我们去手动操作DOM了。
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> </head> <script src="lib/vue.js"></script> <body> <!--将来new的vue的实例，会控制这个元素中的所有内容--> <div id="app"> <p>{{msg}}</p> </div> </body> <script> var vm = new Vue({ el: '#app', data: { msg: 'hello Word', } }) </script> </html>MVVM之间的关系
V层就是视图层，对应的关系是body里面的#app里面需要渲染显示的。
new Vue的实例就是VM调度者
而M在哪里呢？也就是data，保存每个页面的数据
