【MV*模型】

马丁·路德银

已于 2022-04-08 14:03:18 修改

阅读量597

点赞数

分类专栏： GUI开发文章标签： mvc ui

于 2022-04-08 11:20:12 首次发布

本文链接：https://blog.csdn.net/weixin_44304929/article/details/124035351

版权

GUI开发专栏收录该内容

8 篇文章 0 订阅

订阅专栏

理论

MV*模型包括：MVC，MVP，MVVM，MVI。它们的基本思想是相通的：C/P/VM 负责逻辑的处理，Model 提供数据，View 负责显示；目的是相同的：实现视图、业务、数据三个部分代码的解耦。

MVC，MVP，MVVM，MVI是GUI程序演变过程中先后产生的设计模式，后者是前者的改进。三者区别就是解耦程度不同，后者解耦程度更大。

模型	M	V	*
MVC	数据来源	界面	Controller处理业务
MVP	数据来源	界面	Presenter处理业务
MVVM	数据来源	界面	ModelView处理业务

区别

实例

WPF的MMVM

Xaml中的数据与DataContext绑定；DataContext就是ViewModel，ViewModel通过IOC获取Model中的数据。

ViewModel需要继承GalaSoft.MvvmLight.ViewModelBase基类。
View需要继承Window基类。
Model需要继承一个自定义基类，用于实现IOC。

namespace WpfApp3
{
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
            MainViewModel viewModel = new MainViewModel();
            viewModel.Query();
            this.DataContext = viewModel;
        }
    }
}

Vue的MVVM

view和ViewModel实现了双向绑定。

//view
<div id="app">
    <input type="text" v-model="num"><button @click="num++">+</button>
    <h1>
        {{name}} 很帅<br>
        {{num}}位女性为其着迷!
    </h1>
</div>

//ViewModel
<script src="node_modules/vue/dist/vue.js"></script>
<script>
    const app = new Vue({
        el: "#app",
        data:{
            name: "King",
            num: 1
        }
    });
</script>

Spring的MVC

view和controller交互
view

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
</head>
<body>
    Hi JSP. 现在时间是  ${now}
</body>
</html>

controller

@Controller
public class HelloController {

    @RequestMapping("/hello")
    public String hello(Model m){
        m.addAttribute("now",DateFormat.getDateTimeInstance().format(new Date()));
       //到/WEB-INF/jsp目录下去寻找hello.jsp文件
        return "hello";  //视图重定向hello.jsp
    }
}

Qt的MVC

Android的MVC

view和controller耦合在一起。

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"  
    xmlns:tools="http://schemas.android.com/tools"  
    android:layout_width="match_parent"  
    android:layout_height="match_parent"  
    tools:context="com.jay.example.test.MainActivity" >  
    <TextView
        android:id="@+id/txtOne"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="张全蛋"/>
</RelativeLayout>

public class MainActivity extends Activity {  
    private TextView txt;  
  
    @Override  
    protected void onCreate(Bundle savedInstanceState) {  
        super.onCreate(savedInstanceState);  
        setContentView(R.layout.activity_main); //view
        txt = (TextView) findViewById(R.id.textOne); 
        //controller
        txt.setText("helloWorld");
        txt.setTextColor(Color.RED);
    }  
}

马丁·路德银

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
【MV*模型】

理论MV*模型包括：MVC，MVP，MVVM，MVI。它们的基本思想是相通的：C/P/VM 负责逻辑的处理，Model 提供数据，View 负责显示；目的是相同的：实现视图、业务、数据三个部分代码的解耦。MVC，MVP，MVVM，MVI是GUI程序演变过程中先后产生的设计模式，后者是前者的改进。三者区别就是解耦程度不同，后者解耦程度更大。模型MV*MVC数据来源界面Controller处理业务MVP数据来源界面Presenter处理业务MVVM数据来源
复制链接

扫一扫

专栏目录