react04- mvc 、 mvvm

MVC与MVVM

stackoverflow论坛网站

react前端框架

使用框架前: 操作dom ==> js获取dom元素,事件侦听,修改数据,设置样式。。。

  • 操作dom问题:

    • 直接操作dom,会造成大量的回流、重绘,消耗大量性能
    • 操作起来也很麻烦
  • 使用框架后: 数据驱动显示(开发效率更高,性能也更好)

    • 不在直接操作dom
    • 操作数据,修改数据后 ,框架按照相关的数据进行页面的重新渲染
    • 框架的底层实现dom渲染 :构建一套虚拟dom操作真实dom渲染的体系,来避免dom的回流、重绘

react框架采用MVC体系,vue采用MVVM体系 : 这两套体系都是用来实现上面数据驱动显示

  • MVC: module(数据层) + view(视图层) + controller(控制层)

    • 使用jsx语法来构建view试图
    • 构建数据层: 在视图中需要动态处理改变的样式、内容等,都要有对应的数据模型 state中的数据
    • 所谓控制层就是开发的一些列交互用的处理数据的方法
    • 根据业务需求进行某些操作时(修改页面的某些操作),都是修改数据,react框架会按照最新的数据来渲染视图,让用户来看到最新效果
    • 单向驱动只能数据驱动视图(自动),反过来(控制层,自己写的)
  • MVVM : module + view + viewModule(数据、视图监听层)

    • 可以实现数据驱动视图渲染:监听数据更新, 修改数据,视图自动改变
    • 监听页面中元素的内容的改变,修改视图自动修改数据,实现双向驱动
    • 我与vue不熟
相关推荐
又是忙碌的一天18 小时前
SpringMVC的处理流程
java·mvc
派大鑫wink20 小时前
【Day37】MVC 设计模式:原理与手动实现简易 MVC 框架
java·设计模式·mvc
卓怡学长1 天前
m111基于MVC的舞蹈网站的设计与实现
java·前端·数据库·spring boot·spring·mvc
码界奇点3 天前
基于Spring MVC的缺陷管理系统设计与实现
java·spring·车载系统·毕业设计·mvc·源代码管理
工业甲酰苯胺3 天前
如何一步步将 ASP.NET MVC 升级为.NET
asp.net·mvc·.net
雪人.3 天前
Spring MVC经典面试
java·spring·mvc
我来整一篇5 天前
[Razor] ASP.NET Core MVC 前端组件快速使用总结
前端·asp.net·mvc
lang201509285 天前
Spring MVC文件上传:commons-fileupload解析全流程
java·spring·mvc
岁岁种桃花儿5 天前
Spring Boot核心注解详解:@ResponseBody深度解析与实战
spring boot·spring·mvc
xiaolyuh1238 天前
Spring MVC Bean 参数校验 @Validated
java·spring·mvc