Vue.js的基本框架

148 阅读1分钟

一、VUE基本代码

Vue.js 的核心是一个允许采用简洁的模板语法来声明式地将数据渲染进 DOM 的系统

    <!-- 将来new的vue实例,会控制这个 元素中的所有内容 -->
    <!-- VUE实例所控制的元素区域,就是 V  -->
    <div id="app">
        <p>{{msg}}</p>
    </div>
    <script>
        // 创建一个Vue实例
        // 当我们链接以后,在浏览器内存中,就多了一个Vue构造函数
        // 注意:new出来的vm对象,就是MVVM中的VM调度者
        var vm=new Vue({
            el: '#app', //表示:当我们new的这个vue实例,要控制页面上的哪个区域
            // data就是MVVM中的 M 专门用来保存每个页面的数据 
            data:{ //data属性中,存放的是el中要到的数据
                msg:"欢迎学习VUE" 
                //通过VUE提供的指令,很方便的就能把数据渲染到页面上,程序员不再手动操作DOM元素
                //前端的vue之类的框架,提倡手动操作DOM元素
            }
        })

        // $('$content').text(data.msg);
    </script>
</body>