什么是MVVM?

Model-View-ViewModel（简称为MVVM）。

MVVM是一种软件设计模式。

MVVM源自于经典的MVC设计模式。MVVM设计模式促使了前端开发和后端业务的逻辑分离，极大的提高了前端的开发效率，MVVM的核心是ViewModel层。他就像一个中转站，负责将Model中的数据对象来让数据变得更加容易管理和使用，该层向上与视图进行双向数据绑定，向下与Model层通过接口请求进行数据交互，起到呈上启下的作用。

通过一个vue实例来说明MVVM的具体实现

1.view层

<div id="app">
    <p>{{message}}</p>
    <button v-on:click="showMessage()">Click me</button>
</div>

2.viewModel层

var app = new Vue({
    el: '#app',
    data: {  // 用于描述视图状态   
        message: 'Hello Vue!', 
    },
    methods: {  // 用于描述视图行为  
        showMessage(){
            let vm = this;
            alert(vm.message);
        }
    },
    created(){
        let vm = this;
        // Ajax 获取 Model 层的数据
        ajax({
            url: '/your/server/data/api',
            success(res){
                vm.message = res;
            }
        });
    }
})

3.Model层

{
    "url": "/your/server/data/api",
    "res": {
        "success": true,
        "name": "IoveC",
        "domain": "www.cnblogs.com"
    }
}