广告
返回顶部
首页 > 资讯 > 精选 >vue中mvvm和mvc的区别是什么
  • 689
分享到

vue中mvvm和mvc的区别是什么

2023-07-04 21:07:25 689人浏览 八月长安
摘要

本篇内容介绍了“Vue中mvvm和mvc的区别是什么”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!mvvm和mvc的区别:1、mvvm各部分

本篇内容介绍了“Vue中mvvm和mvc的区别是什么”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!

mvvm和mvc的区别:1、mvvm各部分的通信是双向的,而mvc各部分通信是单向的。2、MVVM实现了view与model的自动同步,也就是model属性改变时,不需要手动操作dom元素去改变view的显示,而是改变属性后该属性对应的view层会自动改变。

MVC是什么

MVC是一种设计模式:

M(Model):模型层。是应用程序中用于处理应用程序数据逻辑的部分,模型对象负责在数据库中存取数据;
V(View):视图层。是应用程序中处理数据显示的部分,视图是依据模型数据创建的;
C(Controller):控制层。是应用程序中处理用户交互的部分,控制器接受用户的输入并调用模型和视图去完成用户的需求,控制器本身不输出任何东西和做任何处理。它只是接收请求并决定调用哪个模型构件去处理请求,然后再确定用哪个视图来显示返回的数据。

vue中mvvm和mvc的区别是什么

vue中mvvm和mvc的区别是什么

MVVM是什么

vue框架中MVVM的M就是后端的数据,V就是节点树,VM就是new出来的那个Vue({})对象

M(Model):模型层。就是业务逻辑相关的数据对象,通常从数据库映射而来,我们可以说是与数据库对应的model。
V(View):视图层。就是展现出来的用户界面。
VM(ViewModel):视图模型层。连接view和model的桥梁。因为,Model层中的数据往往是不能直接跟View中的控件一一对应上的,所以,需要再定义一个数据对象专门对应view上的控件。而ViewModel的职责就是把model对象封装成可以显示和接受输入的界面数据对象。

vue中mvvm和mvc的区别是什么

View与ViewModel之间通过双向绑定建立联系,这样当View(视图层)变化时,会自动更新到ViewModel(视图模型),反之亦然。

vue中mvvm和mvc的区别是什么

MVVM的优势

mvc和mvvm都是一种设计思想。 主要就是mvc中Controller演变成mvvm中的viewModel。 mvvm主要解决了mvc中大量DOM操作使页面渲染性能降低,加载速度变慢的问题 。

MVVM与MVC最大的区别就是:它实现了View和Model的自动同步:当Model的属性改变时,我们不用再自己手动操作Dom元素来改变View的显示,它会自动变化。

整体看来,MVVM比MVC精简很多,我们不用再用选择器频繁地操作DOM。

MVVM并不是用VM完全取代了C,ViewModel存在目的在于抽离Controller中展示的业务逻辑,而不是替代Controller,其它视图操作业务等还是应该放在Controller中实现

MVC与MVVM有什么区别

区别一:

mvvm各部分的通信是双向的,而mvc各部分通信是单向的。

区别二:

MVVM 与 MVC 最大的区别就是:它实现了View和Model的自动同步

  • 当Model属性改变时,不用手动操作Dom元素去改变View的显示。

  • 而改变属性后,该属性对应View的显示会自动改变

MVVM响应式原理

  • vue是采用数据劫持配合发布者-订阅者的模式的方式,

    • 通过Object.defineProperty()来劫持各个属性的getter和setter

    • 在数据变动时,发布消息给依赖收集器(dep中的subs),去通知(notify)观察者,做出对应的回调函数,更新视图

  • MVVM作为绑定的入口,整合Observer,Compile和Watcher三者,

    • 通过Observer来监听model数据变化,

    • 通过Compile来解析编译模板指令,

    • 最终利用Watcher搭起Observer,Compile之间的通信桥路,

    • 达到数据变化Observer)=>视图更新视图交互变化=>数据model变更的双向绑定效果。

“vue中mvvm和mvc的区别是什么”的内容就介绍到这里了,感谢大家的阅读。如果想了解更多行业相关的知识可以关注编程网网站,小编将为大家输出更多高质量的实用文章!

--结束END--

本文标题: vue中mvvm和mvc的区别是什么

本文链接: https://www.lsjlt.com/news/347564.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

本篇文章演示代码以及资料文档资料下载

下载Word文档到电脑,方便收藏和打印~

下载Word文档
猜你喜欢
  • vue中mvvm和mvc的区别是什么
    本篇内容介绍了“vue中mvvm和mvc的区别是什么”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!mvvm和mvc的区别:1、mvvm各部分...
    99+
    2023-07-04
  • vue中mvvm和mvc的区别有哪些
    这篇文章主要讲解了“vue中mvvm和mvc的区别有哪些”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“vue中mvvm和mvc的区别有哪些”吧! ...
    99+
    2022-10-19
  • web面试MVC与MVVM区别及Vue为什么不完全遵守MVVM解答
    目录MVC和MVVM区别前述MVC概述优缺点MVVM概述MVVM实现者 — VueVue为什么没有完全遵守MVVM?MVC和MVVM区别 前述 首先, 这两种都只是一种思想,...
    99+
    2022-11-12
  • 在java中spring mvc和struts2的区别是什么
    Struts2是类级别的拦截机制,而Spring mvc是方法级别的拦截机制。Struts2有自己的拦截Interceptor机制,Spring mvc用的是独立的Aop方式。Struts2的配置文件量比Spring mvc大。Struts...
    99+
    2022-10-25
  • ASP.NET中 MVC与WebForm的区别是什么
    这篇文章给大家介绍ASP.NET中 MVC与WebForm的区别是什么,内容非常详细,感兴趣的小伙伴们可以参考借鉴,希望对大家能有所帮助。ASP.NET MVC与WebForm区别谈使用ASP.NET MVC框架,创建默认项目,***直观感...
    99+
    2023-06-17
  • 三层架构和MVC的区别是什么
    本篇内容主要讲解“三层架构和MVC的区别是什么”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“三层架构和MVC的区别是什么”吧!三层架构:1:数据访问层:主要是对...
    99+
    2022-10-19
  • vue中$route和$router的区别是什么
    今天就跟大家聊聊有关vue中$route和$router的区别是什么,可能很多人都不太了解,为了让大家更加了解,小编给大家总结了以下内容,希望大家根据这篇文章可以有所收获。路由的设置和跳转中有两个对象$router和$route,是不是很像...
    99+
    2023-06-25
  • vue中@click和@click.native.prevent的区别是什么
    这篇文章主要介绍“vue中@click和@click.native.prevent的区别是什么”,在日常操作中,相信很多人在vue中@click和@click.native.prevent的区别是什么问题上存在疑惑,小编查阅了各式资料,整理...
    99+
    2023-06-30
  • bootstrap和vue的区别是什么
    bootstrap和vue的区别:1、bootstrap和vue不是一个层级的东西;2、bootstrap是基于HTML、CSS、JavaScript开发的前端开发框架,而vue是一套用于构建用户界面的渐进式JavaScript框架;3、b...
    99+
    2022-10-22
  • vue和react的区别是什么
    本文小编为大家详细介绍“vue和react的区别是什么”,内容详细,步骤清晰,细节处理妥当,希望这篇“vue和react的区别是什么”文章能帮助大家解决疑惑,下面跟着小编的思路慢慢深入,一起来学习新知识吧。具体分析如下:监听数据变化的实现原...
    99+
    2023-06-05
  • vue中axios和ajax区别是什么
    vue中axios和ajax区别是:axios是通过promise实现对ajax技术的一种封装,而ajax则是实现了网页的局部数据刷新。axios可以说是ajax,而ajax不止是axios。用法相同,但个别参数不同。axios用法:axi...
    99+
    2022-10-14
  • Vue中的computed和watch的区别是什么
    Vue中的computed和watch的区别是什么,针对这个问题,这篇文章详细介绍了相对应的分析和解答,希望可以帮助更多想解决这个问题的小伙伴找到更简单易行的方法。下面带大家认识Vue中的computed 和 watch,介绍一下compu...
    99+
    2023-06-22
  • vue中mixin和组件的区别是什么
    本教程操作环境:windows7系统、vue3版,DELL G3电脑。什么是Mixin?混合 (mixins) 是一种分发 Vue 组件中可复用功能的非常灵活的方式。混合对象可以包含任意组件选项。当组件使用混合对象时,所有混合对象的选项将被...
    99+
    2023-05-14
    mixin 组件 Vue
  • vue和uni-app的区别是什么
    这篇文章主要讲解了“vue和uni-app的区别是什么”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“vue和uni-app的区别是什么”吧! ...
    99+
    2022-10-19
  • Vue中的MVVM模式原理是什么
    这篇文章主要介绍“Vue中的MVVM模式原理是什么”的相关知识,小编通过实际案例向大家展示操作过程,操作方法简单快捷,实用性强,希望这篇“Vue中的MVVM模式原理是什么”文章能帮助大家解决问题。1. MVVM模式传统的组件是静态渲染,数据...
    99+
    2023-07-05
  • Vue中的watch、watch和computed的区别是什么
    本文小编为大家详细介绍“Vue中的watch、watch和computed的区别是什么”,内容详细,步骤清晰,细节处理妥当,希望这篇“Vue中的watch、watch和computed的区别是什么”文章能帮助大家解决疑惑,下面跟着小编的思路...
    99+
    2023-07-02
  • vue组件中require和import的区别是什么
    vue组件中require和import的区别有:1.本质不同;2.遵循的规范不同;3.调用方式不同;4.性能不同;5.基本语法不同;vue组件中require和import的区别有以下几点本质不同import是一个解构过程,import语...
    99+
    2022-10-06
  • vue中v-if和v-for的区别是什么
    本教程操作环境:windows7系统、vue3版,DELL G3电脑。首先在官方文档中明确指出v-for和v-if不建议一起使用。一、v-if和v-for的作用v-if 指令用于条件性地渲染一块内容。这块内容只会在指令的表达式返回 true...
    99+
    2023-05-14
    vue3 v-if v-for
  • vue中传参params和data的区别是什么
    今天小编给大家分享一下vue中传参params和data的区别是什么的相关知识点,内容详细,逻辑清晰,相信大部分人都还太了解这方面的知识,所以分享这篇文章给大家参考一下,希望大家阅读完这篇文章后有所收获,下面我们一起来了解一下吧。1、使用d...
    99+
    2023-06-30
  • 前端vue和bootstrap的区别是什么
    本文小编为大家详细介绍“前端vue和bootstrap的区别是什么”,内容详细,步骤清晰,细节处理妥当,希望这篇“前端vue和bootstrap的区别是什么”文章能帮助大家解决疑惑,下面跟着小编的思路慢慢深入,一起来学习新知识吧。在很多人眼...
    99+
    2023-06-27
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作