美文网首页iOS菜鸟到大神iOS实用iOS Developer - MVVM && RAC
使用MVVM减少控制器代码实战(减少56%)

使用MVVM减少控制器代码实战(减少56%)

作者: wg689 | 来源:发表于2016-07-08 15:50 被阅读4736次
减少比例= (360(原来的行数)-159(瘦身后的行数))/360 = 56%

父类 MVC 和MVVM 前后基本不动

父类主要完成如下三个功能:

  • 1)功能:MJRefrsh +上拉下拉没有更多数据,封装到父类的控制器 子类调用3行代码增加所有刷新功能
  • 2)网络失败:显示网络错误的链接,写在父类子类调用一行代码就可
  • 3)加载数据完成,列表中没有数据提示View,比如购买界面,没有购 买记录,写在父类子类一行代码调用

瘦身思路(总的代码量增加了30多行,但是控制器更清爽了)

  • 网络前网络请求函数是这样的

瘦身结果

瘦身具体实现

1)网络请求移到ViewModel

以前网络代码直接写在控制器中,如下所示
- (void)loadDataForCaseDeatailMsg:(NSString*)caseManageId{
    NSMutableDictionary *dict = createMutDict;
    [dict setObject:@"case-info" forKey:@"method"];
    [dict setObject:caseManageId forKey:@"caseManageId"];
    [QTFHttpTool    requestPara:dict
                        needHud:YES
                        hudView:self.view
                 loadingHudText:nil
                   errorHudText:nil
                         sucess:^(NSDictionary *json) {
                             BOOL success = (BOOL)[json[@"success"] boolValue];
                             if(success){
                                 QTCaseDetailModel *caseDetailModel = [[QTCaseDetailModel alloc]init];
                                 caseDetailModel.expertId = json[@"expertId"];
                                 caseDetailModel.userName = json[@"userName"];
                                 caseDetailModel.data = [QTCaseDetailMsgModel objectArrayWithKeyValuesArray:json[@"data"]];
                                 [self gotoChatViewController:caseDetailModel];
                                 
                             }
                         }failur:^(NSError *error) {
                             
                         }];
}
  • MVVM封装后控制器中的网络请求是这样的,控制器只取需要的东西,如下所示,不关心一些无关的细节,细节移到ViewModel中,5行搞定了网络请求获取网络数据,还算精简吧!
- (void)loadDataForCaseDeatailMsg:(NSString*)caseManageId{
    [QTCaseDetailViewModel caseDetailhudView:self.view caseManageId:caseManageId getDataSuccess:^(id item, NSInteger totalPage) {
        [self gotoChatViewController:item];
    } getDataFailure:^(NSError *error) {}];
}

-- 具体实现在viewModle中,viewModel添加hud,完成字典转模型,对后台做错误处理,显示错误(部分工作在我自己封装的底层网络请求实现的)

+ (void)caseDetailhudView:(UIView*)hudView caseManageId:(NSString*)caseManageId getDataSuccess:(GetDataAllSuccessBlock)success getDataFailure:(GetDataFailureBlock)failure{
    NSMutableDictionary *dict = createMutDict;
    [dict setObject:@"case-info" forKey:@"method"];
    [dict setObject:caseManageId forKey:@"caseManageId"];
    [QTFHttpTool    requestPara:dict
                        needHud:YES
                        hudView:hudView
                 loadingHudText:nil
                   errorHudText:nil
                         sucess:^(NSDictionary *json) {
                             BOOL success1 = (BOOL)[json[@"success"] boolValue];
                             if(success1){
                                 QTCaseDetailModel *caseDetailModel = [[QTCaseDetailModel alloc]init];
                                 caseDetailModel.expertId = json[@"expertId"];
                                 caseDetailModel.userName = json[@"userName"];
                                 caseDetailModel.data = [QTCaseDetailMsgModel objectArrayWithKeyValuesArray:json[@"data"]];
                                 success(caseDetailModel,1);
                             }
                         }failur:^(NSError *error) {
                             
                         }];

}

  • 将网络请求部分工作移到Viewmodel中,本控制器有三个网络请求 这样节省代码量很可观

2) datasource,以前直接写在控制机器中,现在写到dataSource 文件中,控制器中调用dataSource这个类

/*
 本类作用:用以处理TableView以及CollectionView的数据源
 */

#import <Foundation/Foundation.h>
@import UIKit;

// 用于配置当前Cell的数据
// id cell表示什么类型的Cell
// id item表示什么类型的模型对象
typedef void (^TableViewCellConfigureBlock)(id cell, id item);

@interface QTArrayDataSource : NSObject <UITableViewDataSource, UICollectionViewDataSource>

// 参数1:用以数据源的控制,主要是通过改数组来控制当前tableView或者collectionView显示Cell的数量
// 参数2:当前需要显示的cell的重用标示
// 参数3:用以配置当前cell数据的block
- (id)initWithItems:(NSArray *)anItems
     cellIdentifier:(NSString *)aCellIdentifier
 configureCellBlock:(TableViewCellConfigureBlock)aConfigureCellBlock;

// 通过indexPath来获取当前具体的某一个对象
- (id)itemAtIndexPath:(NSIndexPath *)indexPath;

@end

#import "QTArrayDataSource.h"
#import "QTSpecialCaseCell.h"

@interface QTArrayDataSource ()

// 当前数据数组
@property (nonatomic, strong) NSArray *items;
// 当前cell重用标示
@property (nonatomic, copy) NSString *cellIdentifier;
// 当前配置cell的block
@property (nonatomic, copy) TableViewCellConfigureBlock configureCellBlock;

@end


@implementation QTArrayDataSource

- (id)init
{
    return nil;
}

- (id)initWithItems:(NSArray *)anItems
     cellIdentifier:(NSString *)aCellIdentifier
 configureCellBlock:(TableViewCellConfigureBlock)aConfigureCellBlock
{
    self = [super init];
    if (self) {
        _items = anItems;
        _cellIdentifier = aCellIdentifier;
        _configureCellBlock = [aConfigureCellBlock copy];
    }
    return self;
}

- (id)itemAtIndexPath:(NSIndexPath *)indexPath
{
    return self.items[(NSUInteger)indexPath.row];
}


#pragma mark UITableViewDataSource

- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
{
    return self.items.count;
}

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:self.cellIdentifier
                                                            forIndexPath:indexPath];
    // 获取当前某一行的对象
    id item = [self itemAtIndexPath:indexPath];
    // 通过调用该block配置当前cell显示的内容
    self.configureCellBlock(cell, item);
    return cell;
}


#pragma mark UICollectionDataSource

- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section
{
    return self.items.count;
}

- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath
{
    QTSpecialCaseCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:self.cellIdentifier
                                                                           forIndexPath:indexPath];
    
    // 获取当前某一行的对象
    
    id item = [self itemAtIndexPath:indexPath];
    // 通过调用该block配置当前cell显示的内容
    self.configureCellBlock(cell, item);
    return cell;
}



@end

3) viewdidload代码中, 以协议的方式加载数据源

  TableViewCellConfigureBlock configureCell = ^(QTSpecialCaseCell
                                            *cell, id data) {
        [cell configureForCell:data];
    };
    [_collectionView registerClass:[QTSpecialCaseCell class] forCellWithReuseIdentifier:CellIdentify];
    self.arrayDataSource = [[QTArrayDataSource alloc]
                            initWithItems:self.data
                            cellIdentifier:CellIdentify
                            configureCellBlock:configureCell];
    self.collectionView.dataSource = self.arrayDataSource;
    self.collectionView.delegate = self;
    [self refreshOneCreateCollectionView:_collectionView methodSelStr:@"loadData"];

4) 本文的待讨论的部分

  • 代理方法没有剥离出来,如果剥离出来,控制器进一步减少到120行左右,代理剥离有点麻烦,感觉没有必要

  • 创建collectionView 的代码没剥离,剥离出来可以再减少20行左右,也参考一些别人的文章,目前觉得就这样了,没必要的

  • 也参考了一些别人的代码原文链接
    如何正确的写好一个UITableView,写的也很高大上,感觉各种继承,真的很复杂耶

Snip20160708_9.png
  • 代码 不能过度封装,也不能不封装

有人对我的网络请求比较感兴趣,我的网络请求,针对公司的后台数据结构做了封装,hud 也封装到网络请求中了


相关文章

  • 使用MVVM减少控制器代码实战(减少56%)

    减少比例= (360(原来的行数)-159(瘦身后的行数))/360 = 56% 父类 MVC 和MVVM 前后...

  • DataBinding

    Data Binding 优势 MVVM 去掉Activity&Fragment内的UI代码 减少FindView...

  • 实现类似Vue的 简单双向数据绑定

    Vue作为当前国内使用广泛的前端MVVM框架,其中的双向数据绑定大大减少了前端代码维护数值变化的难度,显得高效而神...

  • 前端页面优化

    1.使用代码构建工具,减少http请求的次数以及减少http请求的大小。减少http请求大小还包括减少cookie...

  • vue源码解读 -- 双向绑定

    双向绑定是MVVM框架中一个基本也是很诱人的功能,它能够让我们减少dom操作,进而极大减少我们的代码量。我们可以通...

  • ES6笔记

    1. 使用解构赋值减少代码量 2. 同理,使用展开运算符减少代码量 3. Reflect 附ES5中 Object...

  • 混合mixins和extends

    mixins(混入)用途: 减少源代码的污染:已经写好构造器后,需要增加方法或者临时使用的方法 减少代码量,实现代...

  • Tree-Shaking

    Tree-Shading可以提取有用代码,将未被使用的无用代码(dead-code)剔除,减少代码体积。 如何使用...

  • Android性能优化

    15.1.1 布局优化 标签:减少代码量 标签:一般和 标签一起使用从而减少布局的层级。

  • 如何匹配正则表达式

    使用正则表达式,可以减少很多判断,进而减少代码量。(苹果使用了大量的正则表达式) 下面是经常使用的几个符号 下面是...

网友评论

  • calary:博主现在对MVVM的理解是什么样的呢,不知道有没有变化,期待能出一篇新的文章或者给我个链接,我想探讨下这块,自己也没搞清楚这个模式到底该是什么样子的
  • Jack_zz:想问一下博主,什么是MVVM?
    Jack_zz:不过希望博主能出更多的好东西 :smile: 上面的是建议
    Jack_zz:@wg689 但起码,最基本的应该是有的,我是一个初学者!我先去google了MVVM,看到这篇文章,虽然是优化代码,但是和MVVM关系不大(也可能是我google的有问题);我建议还是把题目的MVVM去掉可能好一些,原文的作者好像没有提MVVM
    wg689:@Jack_zz 每个人理解不一样啊
  • af4e8a35bc89:求博主写一个Demo 公司项目的话不方便 可以写一个demo :pray: 1040719208@qq.com
    af4e8a35bc89:@wg689 好吧,主要是没demo,很难了解博主思想,毕竟每位博主思想都有它的闪光点
    wg689:@江湖丽日 唉这个主要是思想 最近换了工作真的很忙耶,以后写文章尽量都附上demo
  • 土土哥:这完全没有理解啥是ViewModel。。。建议作者Google下MVVM。。。
    wg689:@土土哥 每个人的理解不一样.还有很多变种mvvm,还没去研究那么详细
  • 47号同学:可以发一下你修改前和修改后的代码的demo吗?邮箱993597571@qq.com 谢谢
    47号同学:@haojingxue_iOS 这样哦 那没事 自己去尝试一下 有问题可以交流
    wg689:@B2WuXX 这个抽取代码比较麻烦啊 是公司的项目,sorry
  • _海阔天空:楼主能不能共享下网络请求,参考下,自己也想封装一个请求框架。或发邮箱1160337813@qq.com,感谢楼主!!!
  • Romit_lee:真正的 mvvm 的初衷并不是分离 viewController 的代码,mvc 照样可以分离 ViewController 的代码,mvvm 的初衷是组件化开发,一个 viewController 是一个屏幕视图,这个视图可能包含多个可以分离的子视图,那么一个 ViewController 可以管理多个子视图,这些子视图的逻辑由 ViewManger管理,就 ViewController 只需要负责管理这些 ViewManger 就行.就像我们拼积木,可以拼成各种各样的视图, ViewController 负责这些积木之间的联系.至于单独的逻辑, ViewController 不负责.
    wg689:@romitlee 感谢你的意见,你的意见是我前进的指导:sweat_smile:
    Romit_lee:@haojingxue_iOS http://www.jianshu.com/p/4847c9a1e19b你看看这个,分离代码mvc照样可以,
    wg689:@romitlee mvvm初衷为了组件化开发,涨姿势了,通过大家的讨论,发现每个人对mvvm的理解都不同,你有权威点的文档介绍吗?我这个也是参考了一些文档,有的人理解mvvm有绑定,你也可以出一篇mvvm的权威讲解,期待...,:innocent::innocent::innocent:
  • davisjy:能不能给一下demo看呢
    wg689:@davisjy 这是公司的项目一部分,抽demo蛮麻烦,以后有文章,再说吧,这个主要讲了瘦身思路,代码都贴出来了
  • 推遍天下无敌手:一直想写一个网络请求框架, 楼主能不能把网络请求共享出来,或者发我邮箱也行:510988176@qq.com,感谢楼主
    wg689:@推遍天下无敌手 不客气,需要添加一些依赖库
    推遍天下无敌手:@haojingxue_iOS 感谢! :blush:
    wg689:@推遍天下无敌手 我的网络已发送
  • 知傲:这应该是代码拆分,和MVVM还是有很大区别的
    wg689:@zhao0 我的数据绑定是block回传的,viewmodel我只把hud封装到里面了,(因为项目没有自动化测试),为了方便就把hud封装到viewmodel里面了,所以你看到的我的view到viewmodel了,算是有一点点改动
    知傲:@haojingxue_iOS MVVM的核心思想是数据绑定,数据驱动变化。ViewModel只提供数据和command,通过其他方法(例如RAC、KVO)绑定到View上,ViewModel不会包含View
    wg689:@zhao0 mvvm就是把控制器代码拆分,有其他的理解,赐教
  • Fooler:谢谢分享!嘿嘿,再问句你那个自己封装的网络请求框架,将HUD也封装进去了,你是怎么实现的啊?
    Wang66:@我是一朵向阳花 hud是显示在self.view上的,调用方法时将self.view当做参数传入了。

本文标题:使用MVVM减少控制器代码实战(减少56%)

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