본문으로 건너뛰기
안전한 컴파일

안전한 컴파일

더 이상 ProviderNotFoundException 예외가 발생하지 않고, 로딩 상태를 처리하는 것을 걱정하지 않아도 됩니다. Riverpod를 사용하면 코드가 컴파일되면 작동합니다.

제한없는 Provider

제한없는 Provider

Riverpod는 Provider에서 영감을 얻었지만 동일한 유형의 여러 Provider를 지원하는 것과 같은 주요 문제 중 일부를 해결합니다. 비동기 Provider를 기다리고 있습니다. 어디에서나 Provider를 추가하세요.

Flutter에 의존하지 않습니다.

Flutter에 의존하지 않습니다.

Flutter에 의존하지 않고 Provider를 생성/공유/테스트합니다. 여기에는 BuildContext 없이 Provider를 수신할 수 있는 기능이 포함됩니다.

어디에서나 공유할 상태를 선언하세요.

main.dart파일과 UI 파일간 이동할 필요가 없습니다.
테스트 가능성을 잃지 않고 공유 상태의 코드를 그것이 속한 곳에 별도의 패키지에 있거나 그것을 필요로 하는 위젯 바로 옆에 배치하십시오.

// A shared state that can be accessed by multiple
// objects at the same time
final countProvider = StateProvider((ref) => 0);

// Consumes the shared state and rebuild when it changes
class Title extends ConsumerWidget {
@override
Widget build(BuildContext context, WidgetRef ref) {
final count = ref.watch(countProvider);
return Text('$count');
}
}

상태를 다시 계산하거나 필요할 때만 UI를 다시 빌드합니다.

더 이상 build 메서드 내에서 목록을 정렬/필터링하거나 고급 캐시 메커니즘에 의존할 필요가 없습니다.

Provider"families"를 사용하여 목록을 정렬하거나 필요할 때만 HTTP 요청을 수행하세요.

final todosProvider = StateProvider<List<Todo>>((ref) => []);
final filterProvider = StateProvider<Filter>((ref) => Filter.all);

final filteredTodosProvider = Provider<List<Todo>>((ref) {
final todos = ref.watch(todosProvider);
switch (ref.watch(filterProvider)) {
case Filter.all:
return todos;
case Filter.completed:
return todos.where((todo) => todo.completed).toList();
case Filter.uncompleted:
return todos.where((todo) => !todo.completed).toList();
}
});

안전하게 Provider 읽기

Provider를 읽는 중 더 이상 bad state가 되지 않습니다. 만약 Provider를 읽기위한 필요한 코드를 작성하면, 당신은 유요한 값을 얻을 수 있습니다.

Provider는 비동기적으로 로드된 값에도 적용됩니다. 제공자와는 대조적으로 Riverpod는 로드/오류 사례를 깔끔하게 처리할 수 있습니다.

final configurationsProvider = FutureProvider<Configuration>((ref) async {
final uri = Uri.parse('configs.json');
final rawJson = await File.fromUri(uri).readAsString();

return Configuration.fromJson(json.decode(rawJson));
});

class Example extends ConsumerWidget {
@override
Widget build(BuildContext context, WidgetRef ref) {
final configs = ref.watch(configurationsProvider);

// Use Riverpod's built-in support
// for error/loading states using "when":
return configs.when(
loading: () => const CircularProgressIndicator(),
error: (err, stack) => Text('Error $err'),
data: (configs) => Text('data: ${configs.host}'),
);
}
}

Devtool에서 상태를 관찰하세요.

Riverpod를 사용하면 Flutter의 devtool 내부에서 상자 밖에서 상태를 확인할 수 있습니다.
게다가, 진행 상태를 감시할 수 있습니다.

Devtool에서 상태를 관찰하세요.