Vue.js的初步认识

Vue.js是一个MVVM框架，除此之外还有React.js、Angular.js
MVVM包括View-ViewModel-Model三部分：

那么如何理解MVVM呢？
左侧View相当于我们的DOM内容，右侧的Model相当于我们的数据对象，比如一个对象的信息，而中间的监控者就负责监控两侧的数据，并相应地通知另一侧进行修改。这样不用再手动去操纵DOM了。
Vue.js的核心：通过尽可能简单的API实现响应的数据绑定和组合的视图组件。
Vue的数据驱动：数据改变驱动了视图的自动更新，vue.js之需要改变数据，就可以自动改变视图。不需要操心DOM的更新。
视图化组件：把整个网页的拆分成一个个区块，每个区块我们可以看做成一个组件，网页由多个组件拼接或者嵌套而成。
那么什么时候用到Vue.js呢？有以下情况：
1.频繁用jQuery操作DOM来更新页面时用Vue.js
2.项目中有多个部分是相同的，并可以封装成一个组件。
3.IE8以下版本浏览器是不兼容的，如果项目需要兼容低版本的浏览器，Vue.js就不适用了
4个步骤实现创建Vue实例：
1.创建语法：new Vue（）创建Vue实例。

<script>
    new Vue({});
</script>

2.设置数据

new Vue=({
    data:{
        message:"hello world!"
    }
});

3.挂载元素：el参数提供一个在页面上已经存在的DOM元素，作为实例vm的挂载目标
先定义一个视图View部分

<div id="app">
</div>

new Vue({
    el:"#app",
    data:{
        message:"hello world!"
    }
});

4.渲染：把vm的数据绑定到指定的视图上，就是数据渲染，使用{{ }}J就可以得到message的值。

<div id="app">
    {{message}}
</div>