search
HomeWeb Front-endFront-end Q&AIs react an mvvm framework?

react is not an mvvm framework. The mvvm framework needs a vm object to map the view, that is, when the properties of the vm object change, the corresponding view part will be updated accordingly; while there is no vm object in react, there are attributes and states, and the whole can be used as a View. So react is not an mvvm framework.

Is react an mvvm framework?

The operating environment of this tutorial: Windows 10 system, react17.0.1 version, Dell G3 computer.

Is react an mvvm framework?

react is not an mvvm framework

First understand what mvvm means. vm means view mode.

So the mvvm framework requires a vm object to map the view. That is, when the attributes of the vm object change, the corresponding view part will be updated accordingly.

The more classic one is knockoutjs, in which the key concepts are view model, compute, view template, etc. Yes, there are actually a lot of its shadows in vue.

Then let’s take a look at react. It does not have a vm object in a pure sense, but only attributes and states.

React can be used as the second V in MVVM, which is View, but it is not an MVVM framework.

One of the most significant features of MVVM: two-way binding.

React does not have this, it is one-way data binding.

React is a one-way data flow library with state-driven views.

React as a whole is based on functional thinking. Components are designed as pure components, and state and logic are passed in through parameters. Therefore, in react, there is a one-way data flow. It is recommended to combine immutable to achieve data immutability.

Then let’s take a look at react. It does not have a vm object in a pure sense, but only attributes and states. Use properties and states to map views. So what is the difference between attributes and states and vm? Personally, I think that the vm object will be treated equally regardless of whether the value is passed in from the outside or defined internally. In many cases, there is a two-way binding mechanism. Maybe the early flex was amazing, but the later mvvm framework has the concept of two-way binding. React, on the other hand, emphasizes attribute immutability and one-way data flow.

The internal state is controlled internally. Such a design may be more complex in terms of design, but it becomes more certain and clearer in terms of use. If you are familiar with React, managing appropriate states for appropriate components and stratifying states reasonably will greatly reduce application complexity. Then, redux has a very advanced concept called container components and pure display components. If you understand this design idea, you can concentrate complex things into a small number of components, and most of the components will become pure display components, further reducing the complexity of the application. sex.

Recommended learning: "react video tutorial"

The above is the detailed content of Is react an mvvm framework?. For more information, please follow other related articles on the PHP Chinese website!

Statement
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
CSS: Can I use multiple IDs in the same DOM?CSS: Can I use multiple IDs in the same DOM?May 14, 2025 am 12:20 AM

No,youshouldn'tusemultipleIDsinthesameDOM.1)IDsmustbeuniqueperHTMLspecification,andusingduplicatescancauseinconsistentbrowserbehavior.2)Useclassesforstylingmultipleelements,attributeselectorsfortargetingbyattributes,anddescendantselectorsforstructure

The Aims of HTML5: Creating a More Powerful and Accessible WebThe Aims of HTML5: Creating a More Powerful and Accessible WebMay 14, 2025 am 12:18 AM

HTML5aimstoenhancewebcapabilities,makingitmoredynamic,interactive,andaccessible.1)Itsupportsmultimediaelementslikeand,eliminatingtheneedforplugins.2)Semanticelementsimproveaccessibilityandcodereadability.3)Featureslikeenablepowerful,responsivewebappl

Significant Goals of HTML5: Enhancing Web Development and User ExperienceSignificant Goals of HTML5: Enhancing Web Development and User ExperienceMay 14, 2025 am 12:18 AM

HTML5aimstoenhancewebdevelopmentanduserexperiencethroughsemanticstructure,multimediaintegration,andperformanceimprovements.1)Semanticelementslike,,,andimprovereadabilityandaccessibility.2)andtagsallowseamlessmultimediaembeddingwithoutplugins.3)Featur

HTML5: Is it secure?HTML5: Is it secure?May 14, 2025 am 12:15 AM

HTML5isnotinherentlyinsecure,butitsfeaturescanleadtosecurityrisksifmisusedorimproperlyimplemented.1)Usethesandboxattributeiniframestocontrolembeddedcontentandpreventvulnerabilitieslikeclickjacking.2)AvoidstoringsensitivedatainWebStorageduetoitsaccess

HTML5 goals in comparison with older HTML versionsHTML5 goals in comparison with older HTML versionsMay 14, 2025 am 12:14 AM

HTML5aimedtoenhancewebdevelopmentbyintroducingsemanticelements,nativemultimediasupport,improvedformelements,andofflinecapabilities,contrastingwiththelimitationsofHTML4andXHTML.1)Itintroducedsemantictagslike,,,improvingstructureandSEO.2)Nativeaudioand

CSS: Is it bad to use ID selector?CSS: Is it bad to use ID selector?May 13, 2025 am 12:14 AM

Using ID selectors is not inherently bad in CSS, but should be used with caution. 1) ID selector is suitable for unique elements or JavaScript hooks. 2) For general styles, class selectors should be used as they are more flexible and maintainable. By balancing the use of ID and class, a more robust and efficient CSS architecture can be implemented.

HTML5: Goals in 2024HTML5: Goals in 2024May 13, 2025 am 12:13 AM

HTML5'sgoalsin2024focusonrefinementandoptimization,notnewfeatures.1)Enhanceperformanceandefficiencythroughoptimizedrendering.2)Improveaccessibilitywithrefinedattributesandelements.3)Addresssecurityconcerns,particularlyXSS,withwiderCSPadoption.4)Ensur

What are the main areas where HTML5 tried to improve?What are the main areas where HTML5 tried to improve?May 13, 2025 am 12:12 AM

HTML5aimedtoimprovewebdevelopmentinfourkeyareas:1)Multimediasupport,2)Semanticstructure,3)Formcapabilities,and4)Offlineandstorageoptions.1)HTML5introducedandelements,simplifyingmediaembeddingandenhancinguserexperience.2)Newsemanticelementslikeandimpr

See all articles

Hot AI Tools

Undresser.AI Undress

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

AI Clothes Remover

Online AI tool for removing clothes from photos.

Undress AI Tool

Undress AI Tool

Undress images for free

Clothoff.io

Clothoff.io

AI clothes remover

Video Face Swap

Video Face Swap

Swap faces in any video effortlessly with our completely free AI face swap tool!

Hot Article

Hot Tools

mPDF

mPDF

mPDF is a PHP library that can generate PDF files from UTF-8 encoded HTML. The original author, Ian Back, wrote mPDF to output PDF files "on the fly" from his website and handle different languages. It is slower than original scripts like HTML2FPDF and produces larger files when using Unicode fonts, but supports CSS styles etc. and has a lot of enhancements. Supports almost all languages, including RTL (Arabic and Hebrew) and CJK (Chinese, Japanese and Korean). Supports nested block-level elements (such as P, DIV),

SublimeText3 Chinese version

SublimeText3 Chinese version

Chinese version, very easy to use

WebStorm Mac version

WebStorm Mac version

Useful JavaScript development tools

Zend Studio 13.0.1

Zend Studio 13.0.1

Powerful PHP integrated development environment

Dreamweaver Mac version

Dreamweaver Mac version

Visual web development tools