Bucket Provider 대신에 Riverpod 로 변경해보고... - 인프런

Flutter 앱 개발 기초

실습. 한 줄 일기

Bucket Provider 대신에 Riverpod 로 변경해보고 싶어요.

해결된 질문

작성

173

안녕하세요. 3강 강의를 듣고 질문드립니다.

상태관리는 Riverpod 로 변경해보고 싶은데 잘 안됩니다.

/// 버킷 클래스
class Bucket {
  String job; // 할 일
  bool isDone; // 완료 여부

  Bucket(this.job, this.isDone); // 생성자
}

Provider 의 BucketService

class BucketService extends ChangeNotifier {
  List<Bucket> bucketList = [
    //Bucket('잠자기', false), // 더미데이터
  ];

  /// bucket 추가
  void createBucket(String job){
    bucketList.add(Bucket(job, false));
    notifyListeners();
  }

  /// bucket 수정
  void updateBucket(Bucket bucket, int index){
    bucketList[index] = bucket;
    notifyListeners();
  }

  /// bucket 삭제
  void deleteBucket(int index){
    bucketList.removeAt(index);
    notifyListeners();
  }
}

이걸 Riverpod v2 기준으로 변경해보고 싶은데 매개변수를 그대로 사용하면서 할 수 있는 방법을 모르겠습니다.

final bucketProvider = NotifierProvider<BucketNotifier, List<Bucket>>(BucketNotifier.new);

class BucketNotifier extends Notifier<List<Bucket>> {
  @override
  List<Bucket> build() => [];

  /// bucket 추가
  void createBucket(String job){
    state = [...state, Bucket(job, false)];
  }

  /// bucket 수정
  void updateBucket(Bucket bucket, int index){

  }

  /// bucket 삭제
  void deleteBucket(int index){
    //state = state.where((element) => element != index).toList();
    // element 에는 index 가 없는데 어떻게 비교할 수 있을까?
  }

}

flutter

답변 1

DevStory

지식공유자

안녕하세요

주석에 남겨두신 element 에는 index 가 없는데 어떻게 비교할 수 있을까?에 대한 답변 드립니다.

state = state.where((element) => element != index).toList();

특정 index의 값을 제거한 새로운 배열을 반환하는 두 가지 방법 소개드립니다.

state = [
    ...state.sublist(0, index),
    ...state.sublist(index + 1),
];

state = List.from(state)..removeAt(index);

감사합니다.

Link

질문자

정말 감사드립니다.

두번쩨 방법으로 해보니 잘 되는 거 확인했습니다.

/// bucket 수정
  void updateBucket(Bucket bucket, int index){

  }

bucket 수정 함수 코드는 어떻게 작성할 수 있을까요?

다른 방법으로는 모델에 id를 추가해서 아래와 같은 코드로 동작하는 건 확인했습니다.

/// 버킷 클래스
class Bucket {
  String id;
  String job; // 할 일
  bool isDone; // 완료 여부

  Bucket(this.id, this.job, this.isDone); // 생성자
}

final bucketProvider = NotifierProvider<BucketNotifier, List<Bucket>>(BucketNotifier.new);

class BucketNotifier extends Notifier<List<Bucket>> {
  @override
  List<Bucket> build() => [];

  /// bucket 추가
  void createBucket(String job){
    state = [...state, Bucket((state.length + 1).toString(),job, false)];
  }

  /// bucket 수정
  void updateBucket(Bucket bucket){
    print('${bucket.id} ::: ${bucket.job}');
    state = [
      for(final item in state)
        if(item.id == bucket.id)
          Bucket(item.id, bucket.job, bucket.isDone)
        else
          item
    ];
  }

  /// bucket 삭제
  void deleteBucket(int index){
    //state = state.where((e) => e.id != bucket.id).toList(); // Bucket bucket 인자로 받을 때
    state = List.from(state)..removeAt(index);
  }

}

DevStory

지식공유자

수정은 다음 방법들을 참고해 주세요.

state = state.map((e) => e.id == bucket.id ? bucket : e).toList()

state = [
   for(int i=0; i<state.length; i++) i == index ? bucket : state[i]
];

state = [
  for(final e in state) state.id == e.id ? bucket : e
];

state = [
  ...state.sublist(0, index),
  bucket,
  ...state.sublist(index + 1),
].toList();

감사합니다 :)

인프런 커뮤니티 질문&답변

Bucket Provider 대신에 Riverpod 로 변경해보고 싶어요.