riverpod-codegen-and-hooks

Riverpod — コード生成とフック

コード生成

Riverpod ではコード生成は任意です。プロバイダーを定義する構文が変わります。アノテーションを付けた関数またはクラスを記述すると、ジェネレーターがプロバイダーを生成します。すでにコード生成（Freezed、json_serializable など）を使用している場合は利用してください。そうでない場合、追加のビルド手順に見合わないことがあります。セットアップ（build_runner、riverpod_generator）については riverpod-getting-started を参照してください。

メリット

• より明確な構文：プロバイダーの型（Provider、FutureProvider など）を手動で指定する必要はなく、Riverpod が推論します。
• パラメーター：単一のファミリーパラメーターではなく、任意のパラメーター（名前付き、オプション、デフォルト値）を使用できます。
• Riverpod コードの状態を保持したホットリロード。
• 生成されたメタデータによる、より優れたデバッグ。

構文

関数ベースのプロバイダー（同期）：

@riverpod
String example(Ref ref) {
  return 'foo';
}

クラスベースのプロバイダー（同期、副作用を扱うメソッド付き）：

@riverpod
class Example extends _$Example {
  @override
  String build() => 'foo';
  // Add methods to mutate state
}

非同期： Future／FutureOr／Stream を使用します。非同期関数には AsyncValue が設定され、ローディング／エラー処理が自動的に行われます。自動破棄： コード生成ではデフォルトで有効です。@Riverpod(keepAlive: true) で無効にできます。

@riverpod
String example1(Ref ref) => 'foo';

@Riverpod(keepAlive: true)
String example2(Ref ref) => 'foo';

パラメーター： 関数にパラメーターを追加します（一貫して指定すると必須になります）。

@riverpod
Future<User> fetchUser(Ref ref, {required int userId}) async {
  final json = await http.get('api/user/$userId');
  return User.fromJson(json);
}

手動で同等のものを作成する場合は、FutureProvider.autoDispose.family<User, int>(...) になります。概念については riverpod-providers と riverpod-family を参照してください。

---

フック

フックは[flutter_hooks]（Riverpod とは別のもの）から提供されます。ローカルなウィジェットの状態（TextEditingController、AnimationController など）に使用し、StatefulWidget やビルダーのネストを置き換えられます。フックを使いたい場合にのみ使用してください。Riverpod で必須ではありません。初めて使う場合は、まずフックを避けることをおすすめします。

フックと Riverpod を一緒に使う

flutter_hooks と hooks_riverpod の両方が必要です。そのうえで、次のいずれかを選びます。

オプション 1：HookConsumerWidget — フックと ref の両方をサポートする基底クラスです。

class Example extends HookConsumerWidget {
  @override
  Widget build(BuildContext context, WidgetRef ref) {
    final counter = useState(0);
    final value = ref.watch(myProvider);
    return Text('Hello $counter $value');
  }
}

オプション 2：HookConsumer — HookBuilder と Consumer を組み合わせるビルダーです（flutter_riverpod のみを使う場合はネストする必要があります。hooks_riverpod には HookConsumer があります）。

return HookConsumer(
  builder: (context, ref, child) {
    final counter = useState(0);
    final value = ref.watch(myProvider);
    return Text('Hello $counter $value');
  },
);

オプション 3： Consumer と HookBuilder をネストします（hooks_riverpod は不要です）。

フックのルール

• フックは、HookWidget（または HookConsumerWidget）を継承するウィジェットの build メソッド内でのみ使用してください。
• 条件分岐やループ内でフックを使用しないでください。呼び出し順序は常に一定である必要があります。

ウィジェット内の Ref については riverpod-consumers を参照してください。コード生成／フックの詳細は公式ドキュメントを参照してください。