mvvm and mvc --scallopsF

MVVM

Concept: MVVMIt is Model-View-ViewModelan abbreviation, corresponding to: data, view, view model. Model is the data model in our application, and View is our UI view layer. Through ViewModel, the data in our Model can be mapped to the View view. At the same time, if some data is modified in the View layer, it will also reflect and update our model . The simple understanding is 双向数据绑定that when the data changes, the view also changes, and when the view changes, the data also changes synchronously.

1. view layer

<p>Hello, {
    
    {
    
     name }}!</p>          --View层 --VUE中的单向绑定
<input v-model="name">             --View层 --VUE中的双向绑定

2. model data layer

data: {
    
    
            name: ''               --Model层
        }

3. VM layer

 VUE框架已封装好
new Vue({
    
    …})

The relationship between the three:

The view can affect the model through event binding (or v-model instruction), the model can affect the view through data binding, and the viewModel is the connector that connects the model and the view

Summary of MVC pattern (typical framework is angular.js)

1. That is, Model, View, and Controller are data models, views, and controllers.
View: view layer;
Model: business data layer;
Controller: controller. Link the instructions passed from the View layer, select the data corresponding to the Model layer, and perform corresponding operations.
2 To give a similar example in reality, MVC is like the operation mode of a store, the View layer is equivalent to the storefront of this store, the Model layer is equivalent to the warehouse of this store, and the Controller layer is equivalent to the executive department of this store.
Features: MVC has the following two modes. Regardless of the mode, the communication of MVC is one-way. It can also be seen from the figure that the View layer will get data from the Model layer, so the View layer and Model layer in MVC still exist coupled.