MVVM设计模式

‌MVVM（Model-View-ViewModel）是一种软件设计模式,MVVM模式由三个主要部分组成：

‌Model（模型）‌：负责管理应用程序的业务逻辑和数据。它不关心UI如何展示数据，主要负责与服务器通信和数据处处理‌。
‌View（视图）‌：直接与用户交互的界面，负责展示数据。视图不包含业务逻辑，只负责数据的展示‌。
‌ViewModel（视图模型）‌：作为视图和模型之间的桥梁，包含UI逻辑，通过数据绑定机制驱动视图的变化。它处理用户的输入并将结果传递给模型‌。

MVVM的核心机制和优势
‌数据绑定‌是MVVM的核心机制，它允许视图和视图模型之间的自动同步，无需手动编写繁琐的代码来更新界面‌。
这种设计模式的主要优势包括：
‌解耦‌：视图和模型完全解耦，视图模型管理两者的交互，提高了代码的可维护性和扩展性‌。
‌可测试性‌：由于视图模型不依赖于视图，可以通过单元测试来验证业务逻辑的正确性，而不需要启动UI环境‌。
‌提高开发效率‌：通过数据绑定和事件处理，简化了开发过程，减少了手动同步数据的需要‌。

项目结构

mvvm_example/
├── main.cpp
├── view.h
├── view.cpp
├── viewmodel.h
├── viewmodel.cpp
├── model.h
└── model.cpp

代码实现
model.h

#ifndef MODEL_H
#define MODEL_H#include <QObject>
#include <QString>class Model : public QObject
{Q_OBJECTQ_PROPERTY(QString data READ data WRITE setData NOTIFY dataChanged)public:explicit Model(QObject *parent = nullptr);QString data() const;void setData(const QString &newData);signals:void dataChanged();private:QString m_data;
};#endif // MODEL_H

model.cpp

#include "model.h"Model::Model(QObject *parent) : QObject(parent)
{
}QString Model::data() const
{return m_data;
}void Model::setData(const QString &newData)
{if (m_data != newData) {m_data = newData;emit dataChanged();}
}

viewmodel.h

#ifndef VIEWMODEL_H
#define VIEWMODEL_H#include <QObject>
#include "model.h"class ViewModel : public QObject
{Q_OBJECTQ_PROPERTY(QString displayData READ displayData NOTIFY displayDataChanged)public:explicit ViewModel(Model *model, QObject *parent = nullptr);QString displayData() const;signals:void displayDataChanged();public slots:void onModelDataChanged();void setViewModelData(const QString &newData);private:Model *m_model;
};#endif // VIEWMODEL_H

viewmodel.cpp

#include "viewmodel.h"ViewModel::ViewModel(Model *model, QObject *parent) : QObject(parent), m_model(model)
{connect(m_model, &Model::dataChanged, this, &ViewModel::onModelDataChanged);
}QString ViewModel::displayData() const
{return m_model->data();
}void ViewModel::onModelDataChanged()
{emit displayDataChanged();
}void ViewModel::setViewModelData(const QString &newData)
{m_model->setData(newData);
}

view.h

#ifndef VIEW_H
#define VIEW_H#include <QWidget>
#include "viewmodel.h"QT_BEGIN_NAMESPACE
namespace Ui { class View; }
QT_END_NAMESPACEclass View : public QWidget
{Q_OBJECTpublic:explicit View(ViewModel *viewModel, QWidget *parent = nullptr);~View();private slots:void on_pushButton_clicked();void updateLabel(const QString &data);private:Ui::View *ui;ViewModel *m_viewModel;
};
#endif // VIEW_H

view.cpp

#include "view.h"
#include "ui_view.h"View::View(ViewModel *viewModel, QWidget *parent): QWidget(parent), ui(new Ui::View), m_viewModel(viewModel)
{ui->setupUi(this);// 绑定 ViewModel 的 displayDataChanged 信号到更新标签的槽函数connect(m_viewModel, &ViewModel::displayDataChanged, this, [this]() {updateLabel(m_viewModel->displayData());});// 绑定按钮点击信号到槽函数connect(ui->pushButton, &QPushButton::clicked, this, &View::on_pushButton_clicked);
}View::~View()
{delete ui;
}void View::on_pushButton_clicked()
{QString input = ui->lineEdit->text();m_viewModel->setViewModelData(input);
}void View::updateLabel(const QString &data)
{ui->label->setText(data);
}

main.cpp

#include "view.h"
#include "model.h"
#include "viewmodel.h"
#include <QApplication>int main(int argc, char *argv[])
{QApplication a(argc, argv);Model model;ViewModel viewModel(&model);View view(&viewModel);view.show();return a.exec();
}

在上述代码里，MainWindow 类实际上就充当了 View 的角色。不过为了更清晰地体现 View 的概念，我们可以把界面相关的操作进一步封装，并且更明确地展示 View、ViewModel 和 Model 之间的交互。以下是改进后的代码：

项目结构

mvvm_example/
├── main.cpp
├── view.h
├── view.cpp
├── viewmodel.h
├── viewmodel.cpp
├── model.h
└── model.cpp

代码实现

model.h
#ifndef MODEL_H
#define MODEL_H#include <QObject>
#include <QString>class Model : public QObject
{Q_OBJECTQ_PROPERTY(QString data READ data WRITE setData NOTIFY dataChanged)public:explicit Model(QObject *parent = nullptr);QString data() const;void setData(const QString &newData);signals:void dataChanged();private:QString m_data;
};#endif // MODEL_H
model.cpp
#include "model.h"Model::Model(QObject *parent) : QObject(parent)
{
}QString Model::data() const
{return m_data;
}void Model::setData(const QString &newData)
{if (m_data != newData) {m_data = newData;emit dataChanged();}
}
viewmodel.h
#ifndef VIEWMODEL_H
#define VIEWMODEL_H#include <QObject>
#include "model.h"class ViewModel : public QObject
{Q_OBJECTQ_PROPERTY(QString displayData READ displayData NOTIFY displayDataChanged)public:explicit ViewModel(Model *model, QObject *parent = nullptr);QString displayData() const;signals:void displayDataChanged();public slots:void onModelDataChanged();void setViewModelData(const QString &newData);private:Model *m_model;
};#endif // VIEWMODEL_H
viewmodel.cpp
#include "viewmodel.h"ViewModel::ViewModel(Model *model, QObject *parent) : QObject(parent), m_model(model)
{connect(m_model, &Model::dataChanged, this, &ViewModel::onModelDataChanged);
}QString ViewModel::displayData() const
{return m_model->data();
}void ViewModel::onModelDataChanged()
{emit displayDataChanged();
}void ViewModel::setViewModelData(const QString &newData)
{m_model->setData(newData);
}
view.h
#ifndef VIEW_H
#define VIEW_H#include <QWidget>
#include "viewmodel.h"QT_BEGIN_NAMESPACE
namespace Ui { class View; }
QT_END_NAMESPACEclass View : public QWidget
{Q_OBJECTpublic:explicit View(ViewModel *viewModel, QWidget *parent = nullptr);~View();private slots:void on_pushButton_clicked();void updateLabel(const QString &data);private:Ui::View *ui;ViewModel *m_viewModel;
};
#endif // VIEW_H
view.cpp
#include "view.h"
#include "ui_view.h"View::View(ViewModel *viewModel, QWidget *parent): QWidget(parent), ui(new Ui::View), m_viewModel(viewModel)
{ui->setupUi(this);// 绑定 ViewModel 的 displayDataChanged 信号到更新标签的槽函数connect(m_viewModel, &ViewModel::displayDataChanged, this, [this]() {updateLabel(m_viewModel->displayData());});// 绑定按钮点击信号到槽函数connect(ui->pushButton, &QPushButton::clicked, this, &View::on_pushButton_clicked);
}View::~View()
{delete ui;
}void View::on_pushButton_clicked()
{QString input = ui->lineEdit->text();m_viewModel->setViewModelData(input);
}void View::updateLabel(const QString &data)
{ui->label->setText(data);
}
main.cpp
#include "view.h"
#include "model.h"
#include "viewmodel.h"
#include <QApplication>int main(int argc, char *argv[])
{QApplication a(argc, argv);Model model;ViewModel viewModel(&model);View view(&viewModel);view.show();return a.exec();
}

代码解释

View 类
  • 构造函数：接收一个 ViewModel 对象的指针，负责初始化界面并建立信号与槽的连接。
  • on_pushButton_clicked 槽函数：当用户点击按钮时，获取输入框中的文本，然后调用 ViewModel 的 setViewModelData 方法更新数据。
  • updateLabel 槽函数：当 ViewModel 的 displayData 发生变化时，更新界面上的标签文本。
ViewModel 类
  • 作为 View 和 Model 之间的桥梁，负责处理业务逻辑和数据转换。当 Model 的数据发生变化时，会发出 displayDataChanged 信号通知 View 更新。
Model 类
  • 负责存储和管理数据，当数据发生变化时发出 dataChanged 信号。
main.cpp
  • 创建 Model、ViewModel 和 View 对象，并显示 View。

通过这种方式，我们清晰地划分了 View、ViewModel 和 Model 的职责，实现了 MVVM 模式。

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.rhkb.cn/news/16734.html

如若内容造成侵权/违法违规/事实不符，请联系长河编程网进行投诉反馈email:809451989@qq.com，一经查实，立即删除！

相关文章

FlinkCDC 实现 MySQL 数据变更实时同步

FlinkCDC 实现 MySQL 数据变更实时同步

文章目录 1、基本介绍2、代码实战 2.1、数据源准备2.2、代码实战2.3、数据格式 1、基本介绍 Flink CDC 是 Apache Flink 提供的一个功能强大的组件&#xff0c;用于实时捕获和处理数据库中的数据变更。可以实时地从各种数据库&#xff08;如MySQL、PostgreSQL、Oracle、Mon…
阅读更多...
金融风控项目-1

金融风控项目-1

文章目录 一. 案例背景介绍二. 代码实现1. 加载数据2. 数据处理3. 查询 三. 业务解读 一. 案例背景介绍 通过对业务数据分析了解信贷业务状况 数据集说明 从开源数据改造而来&#xff0c;基本反映真实业务数据销售&#xff0c;客服可以忽略账单周期&#xff0c;放款日期账单金…
阅读更多...
CANMV K230入手体验（1）u盘安装镜像

CANMV K230入手体验（1）u盘安装镜像

这是安装镜像后的磁盘管理。 使用镜像文件名为&#xff1a; CanMV-K230_01Studio_micropython_v1.2.2-0-g4b8cae1_nncase_v2.9.0.img。 安装结束。 套件的sd卡损坏&#xff0c;已申请更换。 小伙伴们注意sd卡的问题&#xff0c;一个上午过去了。C... 下图是资源管理器的截…
阅读更多...
策略模式-小结

策略模式-小结

总结一下看到的策略模式&#xff1a; A:一个含有一个方法的接口 B:具体的实行方式行为1,2,3&#xff0c;实现上面的接口。 C:一个环境类&#xff08;或者上下文类&#xff09;&#xff0c;形式可以是&#xff1a;工厂模式&#xff0c;构造器注入模式&#xff0c;枚举模式。 …
阅读更多...
springCloud-2021.0.9 之 GateWay 示例

springCloud-2021.0.9 之 GateWay 示例

文章目录 前言springCloud-2021.0.9 之 GateWay 示例1. GateWay 官网2. GateWay 三个关键名称3. GateWay 工作原理的高级概述4. 示例4.1. POM4.2. 启动类4.3. 过滤器4.4. 配置 5. 启动/测试 前言 如果您觉得有用的话&#xff0c;记得给博主点个赞&#xff0c;评论&#xff0c;收…
阅读更多...
[FastAdmin] 上传图片并加水印,压缩图片

[FastAdmin] 上传图片并加水印,压缩图片

1.app\common\library\Upload.php 文件 upload方法 /*** 普通上传* return \app\common\model\attachment|\think\Model* throws UploadException*/public function upload($savekey null){if (empty($this->file)) {throw new UploadException(__(No file upload or serv…
阅读更多...
windows系统远程桌面连接ubuntu18.04

windows系统远程桌面连接ubuntu18.04

记录一下自己在配置过程中遇到的问题&#xff0c;记录遇到的两大坑&#xff1a; windows系统通过xrdp远程桌面连接ubuntu18.04的蓝屏问题。参考以下第一章解决。 同一局域网内网段不同的连接问题。参考以下第三章解决&#xff0c;前提是SSH可连。 1. 在ubuntu上安装xrdp 参考&…
阅读更多...
逻辑回归不能解决非线性问题，而svm可以解决

逻辑回归不能解决非线性问题，而svm可以解决

逻辑回归和支持向量机&#xff08;SVM&#xff09;是两种常用的分类算法&#xff0c;它们在处理数据时有一些不同的特点&#xff0c;特别是在面对非线性问题时。 1. 逻辑回归 逻辑回归本质上是一个线性分类模型。它的目的是寻找一个最适合数据的直线&#xff08;或超平面&…
阅读更多...
23页PDF | 国标《GB/T 44109-2024 信息技术 大数据 数据治理实施指南 》发布

23页PDF | 国标《GB/T 44109-2024 信息技术 大数据 数据治理实施指南 》发布

一、前言 《信息技术 大数据 数据治理实施指南》是中国国家标准化管理委员会发布的关于大数据环境下数据治理实施的指导性文件&#xff0c;旨在为组织开展数据治理工作提供系统性的方法和框架。报告详细阐述了数据治理的实施过程&#xff0c;包括规划、执行、评价和改进四个阶…
阅读更多...
ESM3(1)-介绍：用语言模型模拟5亿年的进化历程

ESM3(1)-介绍：用语言模型模拟5亿年的进化历程

超过30亿年的进化在天然蛋白质空间中编码形成了一幅生物学图景。在此&#xff0c;作者证明在进化数据上进行大规模训练的语言模型&#xff0c;能够生成与已知蛋白质差异巨大的功能性蛋白质&#xff0c;并推出了ESM3&#xff0c;这是一款前沿的多模态生成式语言模型&#xff0c;…
阅读更多...
在大型语言模型（LLM）框架内Transformer架构与混合专家（MoE）策略的概念整合

在大型语言模型（LLM）框架内Transformer架构与混合专家（MoE）策略的概念整合

文章目录 传统的神经网络框架存在的问题一. Transformer架构综述1.1 transformer的输入1.1.1 词向量1.1.2 位置编码&#xff08;Positional Encoding&#xff09;1.1.3 编码器与解码器结构1.1.4 多头自注意力机制 二.Transformer分步详解2.1 传统词向量存在的问题2.2 详解编解码…
阅读更多...
【黑马点评】 使用RabbitMQ实现消息队列——3.批量获取1k个用户token，使用jmeter压力测试

【黑马点评】 使用RabbitMQ实现消息队列——3.批量获取1k个用户token，使用jmeter压力测试

【黑马点评】 使用RabbitMQ实现消息队列——3.批量获取用户token&#xff0c;使用jmeter压力测试 3.1 需求3.2 实现3.2.1 环境配置3.2.2 修改登录接口UserController和实现类3.2.3 测试类 3.3 使用jmeter进行测试3.4 测试结果3.5 将用户登录逻辑修改回去3.6 批量删除生成的用户…
阅读更多...
【安全靶场】信息收集靶场

【安全靶场】信息收集靶场

靶场&#xff1a;https://app.hackinghub.io/hubs/prison-hack 信息收集 子域名收集 1.subfinder files.jabprisons.com staging.jabprisons.com cobrowse.jabprisons.com a1.top.jabprisons.com cf1.jabprisons.com va.cobrowse.jabprisons.com vs.jabprisons.com c…
阅读更多...
springboot239-springboot在线医疗问答平台(源码+论文+PPT+部署讲解等)

springboot239-springboot在线医疗问答平台(源码+论文+PPT+部署讲解等)

&#x1f495;&#x1f495;作者&#xff1a; 爱笑学姐 &#x1f495;&#x1f495;个人简介&#xff1a;十年Java&#xff0c;Python美女程序员一枚&#xff0c;精通计算机专业前后端各类框架。 &#x1f495;&#x1f495;各类成品Java毕设 。javaweb&#xff0c;ssm&#xf…
阅读更多...
（一）获取数据和读取数据

（一）获取数据和读取数据

获取公开数据 下载、爬虫、API 一些公开数据集网站&#xff1a; 爬虫&#xff1a; 发送请求获取网页源代码——解析网页源代码内容&#xff0c;提取数据 通过公开API获取&#xff1a; API定义了两个程序之间的服务合约&#xff0c;即双方是如何使用请求和响应来进行通讯的…
阅读更多...
在MacBook Air上本地部署大模型deepseek指南

在MacBook Air上本地部署大模型deepseek指南

随着大模型技术的兴起&#xff0c;越来越多的人开始关注如何在本地部署这些强大的AI模型。如果你也想体验大模型的魅力&#xff0c;那么这篇文章将指导你如何在你的MacBook Air上本地部署大模型. 工具准备 为了实现本地部署&#xff0c;你需要以下工具&#xff1a; Ollama&a…
阅读更多...
Windows中使用Docker安装Anythingllm，基于deepseek构建自己的本地知识库问答大模型，可局域网内多用户访问、离线运行

Windows中使用Docker安装Anythingllm，基于deepseek构建自己的本地知识库问答大模型，可局域网内多用户访问、离线运行

文章目录 Windows中使用Docker安装Anythingllm&#xff0c;基于deepseek构建自己的知识库问答大模型1. 安装 Docker Desktop2. 使用Docker拉取Anythingllm镜像2. 设置 STORAGE_LOCATION 路径3. 创建存储目录和 .env 文件.env 文件的作用关键配置项 4. 运行 Docker 命令docker r…
阅读更多...
git学习【个人记录b站尚硅谷】

git学习【个人记录b站尚硅谷】

git学习 Git基本命令操作设置用户签名初始化本地库添加文件从工作区到暂存区将文件从暂存区添加到本地库修改文件重新提交 Git分支Github操作创建远程库上传到远程库克隆到本地文件夹拉取远程库最新版本到本地 总结 Git基本命令操作 设置用户签名 git config --global user.n…
阅读更多...
【R语言】t检验

【R语言】t检验

一、基本介绍 t检验&#xff08;t-test&#xff09;是用于比较两个样本均值是否存在显著差异的一种统计方法。 t.test()函数的调用格式&#xff1a; t.test(x, yNULL, alternativec("two.sided", "less", "greater"), mu0, pairFALSE, var.eq…
阅读更多...
TDengine 产品由哪些组件构成

TDengine 产品由哪些组件构成

目 录 背景产品生态taosdtaosctaosAdaptertaosKeepertaosExplorertaosXtaosX Agent应用程序或第三方工具 背景 了解一个产品&#xff0c;最好从了解产品包括哪些内容开始&#xff0c;我这里整理了一份儿 TDegnine 产品包括有哪些组件&#xff0c;每个组件作用是什么的说明&a…
阅读更多...
最新文章
推荐文章

Copyright @ 2022~2023