@StateObject / @ObservedObject

 TamagochiView에는 @ObservedObject를 사용한 viewModel이 있다.

struct TamagochiView2: View {
    
    //@Published로 선언된 데이터가 변경될 때의 신호를 받는다.
    @ObservedObject private var viewModel = TamagochiViewModel()
    
    var body: some View {
        VStack {
            Text("밥알: \(viewModel.rice)개, 물방울 \(viewModel.water)개")
            
            HStack {
                TextField("밥알을 입력해주세요", text: $viewModel.riceField)
                Button(action: {
                    viewModel.addRice()
                }, label: {
                    Text("클릭")
                })
            }
            
            HStack {
                TextField("물방울을 입력해주세요", text: $viewModel.waterField)
                Button(action: {
                    viewModel.addWater()
                }, label: {
                    Text("클릭")
                })
            }
        }
        .padding(.horizontal)
        
    }
}

 

MainView에서 TamagochiView를 하위뷰로 구성했을 경우 버튼을 누르면 어떻게 될까?

struct MainTamagochiView: View {
    
    @State private var random = 0
    
    var body: some View {
        
        Button(action: {
            random = Int.random(in: 1...100)
        }, label: {
            Text("랜덤 버튼")
        })
        
        Text("Hello Tamagochi: \(random)")
            .font(.largeTitle)
            .bold()
            .padding()
        
        TamagochiView2()
    }
}

 

ObservedObject를 사용했을 경우

 

StateObject를 사용했을 경우

 

ObservedObject vs StateObject

 

 상위뷰에 State가 변경이 되는 상황 == body가 렌더링 되는 상황

 - 하위 뷰에 StateObject가 있을 때 StateObject는 데이터가 유지가 됨

 - ObservedObject는 상위뷰가 렌더링 될 때 인스턴스가 다시 만들어지면서 초기화가 됨

 - 상위뷰에서 데이터가 달라지지 않아 렌더링이 되지 않는 경우면 둘다 같은 동작을 실행함

 

 상위뷰 body 렌더링 > 하위뷰는 init이 어쩔수 없게 됨

 -> StateObject는 인스턴스 생성 시점에 한번 만들어지고 나면, 뷰가 렌더링 되더라도 뷰내에서 변수 재사용!