[MVVM] 2. ViewModel 구현 - 테이블뷰 뷰모델

miori·2022년 6월 29일
0

ios-MVVM

목록 보기
4/6
post-thumbnail

mvvm 부시기 🫡

서비스를 통해 네트워크가 가능한 코드를 구현했다.

해야할 일

이제, escaping 클로저로 구현된 네트워크 통신이 완료된 후 받은 데이터를 테이블뷰에 띄어주면 된다.

그리고 이 띄어줄 데이터를 뷰모델에서 관리할 것이다.
그리고 받아온 데이터가 변할 때 마다, 테이블뷰에 표시해줘야하기 때문에 앞서만든 Observable을 이용할 것이다.

코드 - fetch

func fetchData(_ query : String) {
    backgroundVM.isHidden.value = false
    self.shoppingNetwork.getItmes("크로스핏 \(query)") { response in
        let observable = Observable(response)
        //value로 넘겨주기
        self.storage.value = observable.value.items
        self.responseData = observable.value
    }
}

뷰모델의 코드이다.

let observable = Observable(response) 우선 observable로 만들어줬다.

- 변수설명

var storage: Observable<[ShoppingItems]> = Observable([])
    
var responseData : ShoppingResponse = ShoppingResponse.EMPTY

우선 stroage 변수는 ShoppingItems를 담고있는 테이블뷰에 보여질 값이다.
그리고 responseData는 네트워크 통신 결과이다. 이 변수를 따로 만든 이유는 무한스크롤 구현을 위한 총 아이템수를 얻기 위해서 이다.

코드 - load more (무한스크롤)

    func loadMoreData(_ query : String) {
        self.shoppingNetwork.next("크로스핏 \(query)", shoppingResponse: responseData) {
            let addedData = $0
            self.storage.value += addedData.items
        }
    }

다음은 무한스크롤을 위한 코드이다. 이 코드는 스크롤지점이 일정 부분에 도달했을때 호출하면 된다.
무한스크롤을 구현하기 위해, 내가 생각해낸 방법은 기존의 데이터에 새로 네트워크 통신된 데이터를 더해주는 것이었다.
따라서, shoppingNetwork.next 에서 통신이 끝나고 받은 새로운 데이터를 기존의 storage에 더해줬다.


이렇게 테이블뷰의 뷰모델을 작성해보았다.
다음에 뷰컨트롤러에서 합쳐, 실제 원하는대로 구동을 하는지 확인해보겠다.

profile
iS를 공부하는 miori 입니다.

0개의 댓글