Chapter 13

[v0.14.0以下版] Consumerで再構築の範囲を制限する

村松龍之介
村松龍之介
2023.02.12に更新
このチャプターの目次

Consumer Widget とは

Consumer は、データを使用する必要のあるWidgetだけを再構築することで、アプリのパフォーマンスを最適化するために使用します。

StatelessWidget で使用することができます。

class HomePage extends StatelessWidget {
  
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('Example')),
      body: Consumer(
        // Consumerで囲むことで、counterProviderが更新された時にTextウィジェットのみが再構築される
        builder: (context, watch, child) {
        // counterProviderを読み取る。
        final count = watch(counterProvider).state;
        return Text('$count');
        },
      ),
    );
  }
}

参考リンク

Consumer | Riverpod
https://riverpod.dev/docs/concepts/reading#consumer