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>