1vue的基本用法mvvm

使用vue

• 首先需要导入相应的包 vue.js

• 根目录建立一个vue的页面html代码

• 导入vue.js文件（当导入包之后，在浏览器的内存中就默认生成了一个vue构造函数）

• 创建script标签

• 创建vue的实例

• new Vue({传page对象})

• 其中的属性一： el：element缩写，el:"#app"表示当前new的vue实例控制哪个区域

• new的实例会控制这个元素中的所有内容

• 属性二：data 存放的是el中用到的数据

      <div id="app">      <p>{{msg}}</p>      </div>     <script>      var vm =new Vue({      el:"#app",      data:{      msg:"欢迎学习"     }     })     </script>

注意：程序员通过Vue提供的指令很方便的就把数据渲染到页面上，程序不在手动执行dom元素了，vue不提倡手动操作donm元素

区分层次

• html 是v vue实例所控制的元素区域就是v

• 整个实例是vm 调度者， new创建出来的对象就是mvvm中的vm调度者，实例进行渲染

• m是数据，渲染数据，msg是数据，data是页面的model

        <!--v-->      <div id="app">      <p>{{msg}}</p>      </div>     <script>     //vm      var vm =new Vue({      el:"#app",     //m      data:{      msg:"欢迎学习"     }     })     </script>