View 层不显示来自Model 层的数据；它显示来自ViewModel 的数据。这完全分离了视图层和模型层。后端是计划执行的关键部分。
一.前后端分离
二 Vue.js介绍
方法1：
Vue官网下载：https://cn.vuejs.org/v2/guide/installation.html
1.什么是Vue.js
开发Vue的工具有很多，但这里我们首先使用一个叫做Hbuilder的工具，这是在讲解Web前端时使用的。
从本质上讲，Vue.js 是MVVM 模式的实现，其作用是ViewModel 层。所以第一个应用程序就是显示数据绑定功能。其操作流程如下：
2.Vue的特点
创建的项目结构如下：
2.1 响应式编程
2.2 组件化
!DOCTYPE htmlhtmlheadmeta charset='utf-8' /title/titlescript type='text/javascript' src='js/vue.js' /script/headbodydiv id='d1 '{{message}}/divscript type='text/javascript'var v=new Vue({el:'#d1', //注意这里el中的字母l不是数字1，d1是ID号data: { message:'Hello Daimenglaoshi' //初始数据}})/script/body/html div 上面的描述。
new Vue: 创建一个vue 对象，以el 和data 作为属性。 el:'#d1': 绑定元素的ID; data:{message:'Hello Daimenglaoshi!'}: 数据对象有一个名为`message` 的属性，绑定的初始值为{{message}}: “message”元素内的大括号用于包装Vue 创建的名为message 的属性并实现数据绑定功能。你不需要自己写js作业。
3.Vue的优势
4.Vue的响应式原理（MVVM）
Vue 允许视图在数据更改时自动更新。
说明：
在前面的代码中，我们创建了一个名为v 的Vue 实例。 var v=new Vue({el:'#d1', data:{message:'Hello Daimenglaoshi' }}) 此时可以直接在控制台输入v 了。要更改该值，您可以一路省略数据。此操作使用Vue 的数据绑定功能来完成此操作，而不是主动操作DOM。 ViewModel层应该使用观察者模式实现数据监控和绑定，以实现对数据和视图的快速响应。
版权声明：本文转载于网络，版权归作者所有。如有侵权，请联系本站编辑删除。
