【Flutter/Riverpod】.family|外部からプロバイダに引数を渡す

今回はRiverpodの修飾子.familyの使い方を紹介します。

.familyを使用することでプロバイダにパラメータを追加し、外部から引数を渡せます。

\ 世界最大級のオンライン学習サービス /

目次

.familyの使い方

//定義
final helloProvider = Provider.family((ref, name) => 'Hello! $name');

上記コードのように.family修飾子をプロバイダの後に付け、(ref, 追加するパラメータ)のようにプロバイダにパラメータを追加できます。

//呼び出し
final hello = ref.watch(helloProvider('Riverpod'));

.familyでパラメータを追加したプロバイダは上記コードのように呼び出します。

サンプルコード

import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';

final helloProvider = Provider.family((ref, name) => 'Hello! $name');

void main() => runApp(const ProviderScope(child: MyApp()));

class MyApp extends ConsumerWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context, WidgetRef ref) {
    final hello = ref.watch(helloProvider('Riverpod'));

    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(title: Text('FlutterZero')),
        body: Center(
          child: Text(
            hello.toString(),
            style: TextStyle(fontSize: 30),
          ),
        ),
      ),
    );
  }
}

一緒に読みたい

参考

  • URLをコピーしました!
目次