美文网首页
架构设计之MVVM

架构设计之MVVM

作者: LeeLeCoder | 来源:发表于2017-06-01 20:18 被阅读0次

iOS中,我们使用的大部分都是MVC架构虽然MVC的层次明确,但是由于功能日益的增加,代码的维护,更多的代码被写在了Controller中,这样Controller就显得非常臃肿。为了给Controller瘦身,后来又从MVC衍生出了一种新的架构模式MVVM架构

MVVM分别指什么
(1) Model-数据层
(2)ViewController/View-展示层
(3)ViewModel- 数据模型

MVVM与MVC的不同

首先我们简化一下MVC的架构模式图:

MVC交互图

在这里,Controller需要做太多得事情,表示逻辑、业务逻辑,所以代码量非常的大。而MVVM:


MVVM交互图

比如我们有一个需求:一个页面,需要判断用户是否手动设置了用户名。如果设置了,正常显示用户名;如果没有设置,则显示“简书0122”这种格式。(虽然这些本应是服务器端判断的)
我们看看MVC和MVVM两种架构都是怎么实现这个需求的

MVC方式实现代码:

Model类:

#import <Foundation/Foundation.h>
@interface User : NSObject
@property (nonatomic, copy) NSString *userName;
@property (nonatomic, assign) NSInteger userId;
@end

Controller类:

#import "HomeViewController.h"
#import "User.h"
@interface HomeViewController ()
@property (nonatomic, strong) UILabel *lb_userName;
@property (nonatomic, strong) User *user;
@end

@implementation HomeViewController

- (void)viewDidLoad {
    [super viewDidLoad];

    if (_user.userName.length > 0) {
        _lb_userName.text = _user.userName;
    } else {
        _lb_userName.text = [NSString stringWithFormat:@"简书%ld", _user.userId];
    }
}

这里我们需要将表示逻辑也放在ViewController中。

MVVM方式实现代码:

Model类同上:

ViewModel类:

#import <Foundation/Foundation.h>
#import "User.h"
@interface UserViewModel : NSObject
@property (nonatomic, strong) User *user;
@property (nonatomic, copy) NSString *userName;

- (instancetype)initWithUser:(User *)user;
@end


#import "UserViewModel.h"

@implementation UserViewModel

- (instancetype)initWithUser:(User *)user {
    self = [super init];
    if (!self) return nil;
        _user = user;
    if (user.userName.length > 0) {
        _userName = user.userName;
    } else {
        _userName = [NSString stringWithFormat:@"简书%ld", _user.userId];
    }
        return self;
}
@end

Controller类:

#import "HomeViewController.h"
#import "UserViewModel.h"

@interface HomeViewController ()

@property (nonatomic, strong) UILabel *lb_userName;
@property (nonatomic, strong) UserViewModel *userViewModel;

@end

@implementation HomeViewController
- (void)viewDidLoad {
    [super viewDidLoad];
        _lb_userName.text = _userViewModel.userName;
}

可见,Controller中我们不需要再做多余的判断,那些表示逻辑我们已经移植到了ViewModel中,ViewController明显轻量了很多 。

总结:

(1) MVVM同MVC一样,目的都是分离Model与View,但是它更好的将表示逻辑分离出来,减轻了Controller的负担;
(2)ViewController中不要引入Model,引入了就难免会在Controller中对Model做处理;

相关文章

  • iOS架构初探(初级 MVC/MVP/MVVM)

    目录: 序言 一、架构的基础 二、架构之MVC 三、架构之MVP 四、架构之MVVM 序言: 架构其实是一个设计上...

  • iOS MVVM架构总结

    参考:iOS 中MVC设计模式iOS MVVM架构iOS MVVM-框架介绍iOS 架构模式MVVM的实践总结iO...

  • Vue快速入门

    MVVM模式 什么是MVVM模式? MVVM(Model-View-ViewModel)是一种软件架构设计模式,由...

  • Android App的设计架构:MVC,MVP,MVVM与架构

    Android App的设计架构:MVC,MVP,MVVM与架构经验谈1. 架构设计的目的1.1 通过设计使程序模...

  • android提升大法

    1、架构设计 1.1 设计模式 1.2 重构《重构改善既有的代码设计》 1.3 架构模式MVP MVC MVVM ...

  • iOS 设计模式 一

    设计模式随记 系统架构模式 1. MVC - MVVM - MVP - MVVM、MVC协调版 MVC :...

  • 架构设计之MVVM

    iOS中,我们使用的大部分都是MVC架构虽然MVC的层次明确,但是由于功能日益的增加,代码的维护,更多的代码被写在...

  • iOS开发小帖:设计模式

    设计模式精彩文章 iOS 架构模式--解密 MVC,MVP,MVVM以及VIPER架构 MVP设计模式 基于面向协...

  • Android架构师

    MVP架构设计 MVVM架构设计 IOC框架与代理模式 泛型及其JSON解析框架 手写ButterKnife框架 ...

  • Android 架构设计:MVC、MVP、MVVM和组件化

    MVC、MVP和MVVM是常见的三种架构设计模式,当前MVP和MVVM的使用相对比较广泛,当然MVC也并没有过时之...

网友评论

      本文标题:架构设计之MVVM

      本文链接:https://www.haomeiwen.com/subject/lmnefxtx.html