SwiftUI MVVM Design Pattern

MVVM

UIKit시절 기존 MVC방식의 문제점은 Controller에서 너무 많은 하중이 가해진다는 점이었다. 그 문제를 보완한 모델이 MVVM이다.
Model - View - ViewModel로 이루어진 이 모델은
기존 Controller의 역할 중 비즈니스로직처리 및 모델 관리만 관여한다.
View를 업데이트하는것과 Input을 받는 부분은 View에서 처리하여 MVVM이 널리 사용된다.
SwiftUI에서 기본적으로 제공하는 바인딩 기능덕분에 모델의 변화가 자동으로 View를 업데이트 해줄 수 있다.

MVVM의 예시로 단순한 카운트View를 만들어보자

import SwiftUI

struct NumberModel { // 데이터 Model에 해당함
    var number: Int
    
}

@Observable // @Observable로 바인딩 캐치
class ContentViewModel { // ViewModel로 Model관리 및 비즈니스 로직 담당.
    var model = NumberModel(number: 0)
    func plusLogic(){
        model.number += 1
    }
    
}

struct ContentView: View { // View에 해당. ViewModel을 참조해 바인딩
	var ViewModel = ContentViewModel()
    
    var body: some View {
        VStack {
            Text("\(ViewModel.model.number)")
            Button{
                ViewModel.plusLogic()
            }label: {
                Text("버튼")
            }
            
        }
    }
}

정리

• MVVM에서 ViewModel은 참조 타입인 class로 선언한다. (@Observable을 사용해서 뷰를 바인딩하기 위해)
• Model은 값 타입인 struct로 선언한다. 대부분 Model은 리액트로 따지자면 타입 정의일 뿐이고,
  뷰모델에서 해당 Model을 통해 프로퍼티를 생성해 사용한다
• View는 ViewModel을 참조(바인딩)해 동적으로 데이터 흐름을 구현한다.