Vue框架知识点

<!-- 1、el有两种写法

                (1)new Vue时候怕配置el属性

                (2)先创建Vue实例，随后头通过v.$mount('#root')指定el的值

        2、data有两种写法

                (1)对象式

                (2)函数式  

                注意点：vue用到组件一定要用函数式，否则会报错

                        函数式不能用箭头函数，箭头函数的this是静态的没有作用域就会指向window中,就没有vue实例了  

    -->

   方式一：

 

方式二：

   这里的data(){}是简写  繁写 data:functon(){}

2.MVVM模型

解释：什么是MVVM模型

    <!--

        MVVM模型

           1、M：模型(model)：data中的数据

           2、V:视图(view):模板代码

           3、VM视图模型(ViewModel):Vue实例

        注意：

           1、data中的所有属性都出现在vm身上

           2、vm身上所有属性及Vue原型所有属性，在Vue模板中直接可以使用

    -->

  代码区：

 <div id="root">

        <h1>hello{{name}}</h1>

        <h2>测试{$options}</h2>

    </div>

    <script>

        new Vue({

            el: '#root',

            data: {

                          name: "pizza"

            }

        })