본문 바로가기

Flutter

riverpod 과 MVVM 활용 - 화면의 데이터(상태)를 관리하는 PostListViewModel 을 먼저 만들어 보자(6)

// 리버팟 중에 notifier 계열이 상태 관리를 담당해주는 클래스이다.

import 'package:class_riverpod_mvvm/models/post.dart';
import 'package:class_riverpod_mvvm/repository/post_repository.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';

// StateNotifier
// 1. 멤버 변수로 T state 변수를 가지고 있다.
// 2. 캡슐화에 핵심이다.
class PostListViewModel extends StateNotifier<List<Post>> {

  // 통신 요청을 통해서 데이터를 가져오는 비즈니스 로직을 담당 시킬꺼다.
  final PostRepository _postRepository;
  // T state --> List<Post> <---
  // 맨 처음 부모클래스 StateNotifier 를 가지고 있는 PostListViewModel 에 상태는
  // 당연히 빈 값을 들고 있다. 
  PostListViewModel(this._postRepository) : super([]);

  // 비즈니스 로직
  Future<void> fetchPosts() async {
    // List<Post> = []
    try {
      final posts = await _postRepository.fetchPosts();
      // List<Post>
      state = posts;
    } catch(e) {
      // List<Post>
      state = [];
    }
  }

  // 삭제하는 비즈니스 로직을 만들어 보자.
  Future<void> deletePost(int id) async {
    try {
      await _postRepository.deletePost(id);
      // 리스트 10개중에 1개를 삭제 했음 --> List<Post> 값 상태가 변경이 되었다.
      // state --> [ Post() , Post (), Post () ];
      // 상태가 변경이 되면 새로운 리스트 객체를 state 변수에 넣어 주어야 
      // 아 생태가 변경이 되었구나 확인해서 화면을 자동으로 갱신해 준다.
      // state --> [ Post() , '삭제' Post () ];
      state = state.where( (post) => post.id != id ).toList(); // 새로운 리스트 객체가 생성
      print("삭제 완료");
    } catch (e) {
      print('삭제 실패 : $e');
    }
  }
}
  • 리버팟에 상태를 관리하는 클래스는 notifier 계열이다. StateNotifier는 상태 관리를 위해 사용되는 리버팟의 notifier 계열 중 하나이다. StateNotifier는 상태를 변경하고, 변경 사항을 알리는 역할을 하기 때문에 상태 관리를 위한 대표적인 notifier이다.
  • MVVM 패턴에서는 ViewModel이 뷰의 상태를 관리하고, 뷰와 비즈니스 로직을 연결해준다.
  • StateNotifier를 사용함으로써 상태 관리의 흐름을 간소화하고 상태 변경을 자동으로 UI에 반영할 수 있다. 이를 통해 직접 상태를 갱신하고 변경 사항을 뷰에 반영하는 작업을 줄일 수 있기 때문에 상태 관리의 자동화
  • 이 프로젝트에서는 ViewModel 클래스에 상태 관리용으로 StateNotifier를 사용할 예정이다.
728x90