Vue的个人理解 FirstPage（ 什么是vue.js 框架和库的区别 MVC与MVVM的区别 Vue.js的代码结构 插值表达式、v-cloak、v-text、v-html v-bind）

一、

        什么是vue.js

                Vue.js是一套构建用户界面的渐进式框架，Vue采用自底向上的增量开发的设计。

                Vue.js是前端的主流框架之一，和Angular.js、React.js一起，并成为三大主流框架

二、

        框架和库的区别

                （1）框架：是一套完整的解决方案；对项目的入侵性比较大，项目如果需要更换框架，则需要重新架构整个项目。

                （2）库（插件）：提供某一个小功能，对项目的入侵性小，如果某个库无法完成某些需求，可以很容易的切换到其他库实现需求。

三、MVC与MVVM的区别

        （1）MVC是后端的分层开发概念；

        （2）MVVM是前端视图层的概念：MVVM把前端的视图层，分为了三部分  Model、View、VM ViewModel;

四、Vue.js的代码结构

        （1） 引入vue.js

        (2)  写视图层，我们要展示的内容

        （3）实例化Vue()

                data:存放数据

                el:这个控制的是那块视图

                methods:放我们的方法

   
    

        
        {{ message }}
    

    
    
    

 五、插值表达式、v-cloak、v-text、v-html

        如何获取变量值：

                        插值表达式{{}}，可以在前后插入一些内容

                        v-text：会替换掉元素里的内容

                        v-html：可以渲染html界面

示例：

    
    
    
    
    



    
    

        
        

            -----------{{ message }}---------------
        
        
        
        
        
------------------------
        
------------------------
        
        
1111
    

    
    
    

六、v-bind

                界面元素属性值的绑定

                        括号里不加引号的都是我们data里的数据读取

                        如果想使用字符串需要加上引号

                        里面可以写表达式

                        里面也可以调用定义好的方法，拿到的是方法的返回值

示例：

    
    
    
    



    
    

        
        {{ message }}
        
        按钮