Riverpod의 Provider (1)

Riverpod

• 공식 문서 소개
  Riverpod (Provider의 애너그램-철자를 바꾼 말)는
  Flutter/Dart를 위한 반응형 캐싱 프레임워크(Reactive caching framework)입니다.

riverpod과 provider의 개발자는 같다.
기존의 provider라는 패키지의 여러가지 문제를 수정해 만든 것이 riverpod인데,
riverpod 이라는 이름 역시 provider의 애너그램일 만큼,
riverpod이던 provider던 모두 provider가 패키지의 핵심 요소라고 볼 수 있다.

Provider

사용법

• Provider 만들기

final helloWorldProvider = Provider<String>((ref) => 'Hello world');

• consumer 위젯에서 ref.watch를 통해 불러옴

class MyApp extends ConsumerWidget {
  @override
  Widget build(BuildContext context, WidgetRef ref) {
    final String value = ref.watch(helloWorldProvider);

    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(title: const Text('Example')),
        body: Center(
          child: Text(value),
        ),
      ),
    );
  }
}

Provider의 특징

final myProvider = Provider<myValue()의 타입>((ref) => myValue());

1. final myProvider는 provider 변수 선언하는 방법. 이 변수는 앞으로 Provider 상태를 읽는 데 사용할 변수입니다. Provider는 항상 final이여야 한다.

2. Provider는 모든 Provider 중 가장 기본적인 Provider다. 절대 변하지 않는 객체를 노출합니다. StreamProvider나 NotifierProvider 같은 다른 Provider로 Provider를 대체하여 값과 상호작용하는 방식을 변경할 수 있습니다.

3. 공유 상태를 생성하는 함수. Provider 함수는 항상 ref라는 객체를 매개변수로 받는다. 이 객체를 통해 다른 Provider의 상태를 읽고, Provider 상태가 소멸될 때 일부 작업을 수행하는 등의 작업을 수행할 수 있다.

Provider의 종류

Provider 종류	Provider 생성 함수	사용 사례
Provider	모든 타입을 반환	서비스 클래스/계산된 속성(필터링된 목록 등)
StateProvider	모든 타입을 반환	필터 조건/단순한 상태 객체
FutureProvider	모든 Future 타입을 반환	API 호출 결과
StreamProvider	모든 Stream 타입을 반환	API 호출 결과의 Stream
NotifierProvider	Notifier의 하위 클래스를 반환	불변(변경할 수 없는)의 복잡한 상태 객체(인터페이스를 통하는 경우는 제외)
ChangeNotifierProvider	ChangeNotifier의 하위 클래스를 반환	가변성(변하기 쉬운)의 복잡한 상태 객체

Provider modifier

Provider에 새로운 기능을 추가할 수 있는 방법이 내장되어 있다.
현재는 autoDispose와 family 두가지 존재

1. .autoDispose는 Provider를 더이상 사용하지 않을때, Provider가 자동적으로 상태를 파기하도록 하는 modifier
2. .family는 Provider 외부의 파라미터를 이용해 Provider를 생성할 수 있게 한다.

ex)

final helloWorldProvider =
    Provider.family<String, String>((ref, arg) => 'Hello world $arg!');

// 사용
final String value = ref.watch(helloWorldProvider("Riverpod")); // Hello world RiverPod!"