vue.js总结---（1）mvvm开发思想

MVVM与MVC对比

最新推荐文章于 2024-06-25 14:00:04 发布

原创最新推荐文章于 2024-06-25 14:00:04 发布 · 276 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#vue.js总结

vue.js总结专栏收录该内容

2 篇文章

订阅专栏

本文探讨了MVVM（Model-View-ViewModel）与MVC（Model-View-Controller）设计模式的区别，重点阐述了MVVM如何简化前端开发，通过ViewModel实现双向数据绑定，自动更新UI，无需手动渲染页面或同步数据。

1、主要关注：视图层分离，把前端视图层分为三个部分Model（页面中需要用到的数据），View（页面中的HTML结构），ViewModel（中间的调度者，提供了双向数据绑定的概念）
总结：为什么有了MVC还要有MVVM
MVC是后端开发思想，并没有明确定义前端页面如何开发；MVVM是前端的页面开发思想，把每个页面分成三部分，同时VM作为MVVM的核心，提供了双向数据绑定的概念，前端不需要手动渲染页面，而且，页面数据发送变化，也不需要手动把数据的变化同步到Model中；这所有的操作都是VM自动完成的
2、代码结构
①导入Vue脚本文件；
②在页面body区域添加一个div，这个div将来要被Vue控制；
③创建Vue实例对象
const app=new Vue（{
el:’#app’,//要控制的区域
data：{//被控制区域中要用到的数据
msg;’’
}
}）