前言

在上一篇中
菜鸟用RAC基于AFNetworking 3.0网络的封装搭建记录（四）
自己把网络请求写法想好了，于是开始想用RAC+MVVM的模式准备用在工程中，在写的过程中也能让自己体会RAC做View与Model之间双向绑定的便利。之所以先用在写登录界面中，是因为界面简单，哈哈~，自己可以先易到难。其实在个人看来，一个App中无非是写两种界面：第一种是像登录、注册、修改密码界面样需要客户输入的。第二种就是像TableView样来展示丰富内容不需要用户输入的。
所以后期会想怎么用RAC+MVVM写TableView界面。先摸索登录界面先，走起~

登录界面摸索中

在mvvm模式中主要是view viewModel model之间的双向绑定，而RAC就是这个胶水，负责绑。建立MVVM文件夹，像登录，注册界面纯用户输入型的是没有Model文件的。

登录.png

在登录界面中用MVVM模式想做到的需求是：

• 对输入手机号密码的简单要求判断（手机号11位，密码大于4位），不符号要求弹提示框
• 手机密码输入框都有输入时按钮才高亮，可点击
• 点击按钮后跳转另一界面

界面样子如下。

屏幕快照 2019-04-03 上午9.58.50.png

controller里面的写法

我发现在写viewmodel的时候，有时不知道需要提供给controller什么，因为用mvvm模式就是想得太多，所以个人觉得先大概的实现controller逻辑，到时觉得controller需要什么时，再在viewmodel中添加这样好点。
controller的写法有持有两个对象,一个View,一个ViewModel

@interface STLoginViewController ()

@property (nonatomic,strong) STLoginAccountView * loginView;
@property (nonatomic,strong) STLoginViewModel * loginViewModel;

@end

第一步view布局

-(void)setupSubView
{
    _loginView = [[STLoginAccountView alloc] initWithFrame:CGRectMake(0, 150, self.view.bounds.size.width, 250)];
    
    [self.view addSubview:_loginView];
    
    [self bindViewModel];
}

第二步绑定用到数据

-(void)bindViewModel
{
    //绑定手机号 这样写可以self.loginView.PhoneTF.text = 复制时也能调用
    RAC(self.loginViewModel,phoneNumber ) = [RACSignal merge:@[RACObserve(self.loginView.phoneTF, text),self.loginView.phoneTF.rac_textSignal]];
    //绑定密码
    RAC(self.loginViewModel,password) = [RACSignal merge:@[RACObserve(self.loginView.psdTF, text),self.loginView.psdTF.rac_textSignal]];
    //绑定登录按钮的使能
    RAC(self.loginView.loginBtn,enabled) = self.loginViewModel.loginEnableSignal;

    
    @weakify(self);
    //按钮点击
    [[[self.loginView.loginBtn rac_signalForControlEvents:UIControlEventTouchUpInside] doNext:^(__kindof UIControl * _Nullable x) {
        @strongify(self);
        //这里可以加转转，但登录界面输入框有格式校验
    
    }] subscribeNext:^( UIButton *  sender) {
        @strongify(self)
        
        //对手机账号进行判断
        if (self.loginViewModel.phoneNumber.length != 11) {
            [CMTipsView showTips:@"请输入正确的手机号"];
            return ;
        }
        if (self.loginViewModel.password.length < 4) {
            [CMTipsView showTips:@"请输入正确的密码"];
            return ;
        }
    
        
        NSLog(@"执行到了这里");
        [CMTipsView showProgressHud:@"正在加载……" addToView:self.view];
        [self.loginViewModel.loginCommand execute:nil];
        
    }];
    
   /*这种按钮的写法也是一样的
    [[self.loginView.loginBtn rac_signalForControlEvents:UIControlEventTouchUpInside]  subscribeNext:^(__kindof UIControl * _Nullable x) {
        //对手机账号进行判断
        if (self.loginViewModel.phoneNumber.length != 11) {
            [CMTipsView showTips:@"请输入正确的手机号"];
            return ;
        }
        if (self.loginViewModel.password.length < 4) {
            [CMTipsView showTips:@"请输入正确的密码"];
            return;
        }
        NSLog(@"执行到了这里");
        [CMTipsView showProgressHud:@"正在加载……" addToView:self.view];
        [self.loginViewModel.loginCommand execute:nil];
    }];*/

    //登录按钮颜色改变
    RAC(self.loginView.loginBtn,backgroundColor) = [RACSignal combineLatest:@[self.loginView.phoneTF.rac_textSignal,self.loginView.psdTF.rac_textSignal] reduce:^id _Nonnull(NSString * account,NSString * psd){
        UIColor * color = [UIColor grayColor];
        if (account.length&& psd.length) {
            color = [UIColor orangeColor];
        }
        return color;
    }];
    
    //登录请求数据成功
    [self.loginViewModel.loginCommand.executionSignals.switchToLatest  subscribeNext:^(id  _Nullable x) {
        @strongify(self);
        NSLog(@"执行成功了");
        [CMTipsView hideHUDForView:self.view];
        
        TestViewController * testVc= [[TestViewController alloc] init];
        [self.navigationController pushViewController:testVc animated:YES];
        
    }];
    //数据失败
    [self.loginViewModel.loginCommand.errors subscribeNext:^(NSError * _Nullable x) {
        @strongify(self);
        [CMTipsView hideHUDForView:self.view];
        [CMTipsView showTips:x.userInfo[@"msg"]];
    }];
    
}

在绑定的时候觉得有些注意的地方是：RAC(self.loginViewModel,phoneNumber ) = [RACSignal merge:@[RACObserve(self.loginView.phoneTF, text),self.loginView.phoneTF.rac_textSignal]];这里。

ViewModel

在写viewmodel时要有明确的目标，知道自己要提供什么。如在.h中：

@interface STLoginViewModel : NSObject

@property (nonatomic,copy) NSString * phoneNumber;
@property (nonatomic,copy) NSString * password;
@property (nonatomic,strong) RACCommand * loginCommand; //登录执行的命令
@property (nonatomic,strong) RACSignal * loginEnableSignal ;  //按扭点击是否有效的信号


@end

.m的实现，

-(instancetype)init
{
    self = [super init];
    if (self) {
        [self createRACSignal];
    }
    return self;
}

-(void)createRACSignal
{
    @weakify(self);
    self.loginEnableSignal = [[RACSignal combineLatest:@[RACObserve(self, phoneNumber),RACObserve(self, password)] reduce:^id _Nonnull(NSString * phone,NSString * psd ){
        
        return @(phone.length > 0 && psd.length > 0);
    }] distinctUntilChanged];
    
    
    
    self.loginCommand = [[RACCommand alloc] initWithSignalBlock:^RACSignal * _Nonnull(id  _Nullable input) {
        
        @strongify(self);
   
        @weakify(self);
       //模拟网络请求
        return  [RACSignal createSignal:^RACDisposable * _Nullable(id<RACSubscriber>  _Nonnull subscriber) {
            @strongify(self);
            @weakify(self);
            dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)5.0*NSEC_PER_SEC), dispatch_get_main_queue(), ^{
                NSLog(@"模拟成功的请求");
                [subscriber sendNext:nil];
                [subscriber sendCompleted];
            });
            return nil;
            
        }];
        
//        return
        
    }];
}

需要注意的是distinctUntilChanged 运用

总结

• 在写时有些注意使用的细节问题。
• RACCommand的运用