【Flutter/Riverpod】StateProviderの直近データを元にupdateで更新

今回はRiverpodのStateProviderで直近データを元に新しくデータを算出し更新する方法を紹介します。

直近データを元にデータの算出・更新するにはupdate()を使用します。

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

目次

update()を使用しなくても更新可能

//グローバル変数
final counterProvider = StateProvider((ref) => 0);
class MyApp extends ConsumerWidget {
  @override
  Widget build(BuildContext context, WidgetRef ref) {
    final count = ref.watch(counterProvider);

    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(title: const Text('FlutterZero')),
        floatingActionButton: FloatingActionButton(
          child: Icon(Icons.add),
          onPressed: () => ref.read(counterProvider.notifier).state = ref.read(counterProvider.notifier).state + 1,
        ),
        body: Center(
          child: Text(
            count.toString(),
            style: TextStyle(fontSize: 30),
          ),
        ),
      ),
    );
  }
}

上記コードのようにupdate()を使用せずstateを2度使用してStateProviderを更新することは可能です。

//update()なし
ref.read(counterProvider.notifier).state = ref.read(counterProvider.notifier).state + 1,

しかしながら、コードが長くなってしまうためupdate()を使用します。

update()で直近データを元にデータを算出・更新

//update()あり
ref.read(counterProvider.notifier).update(((state) => ++state))

update()を使用すれば上記コードのように簡略化できます。

サンプルコード

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

final counterProvider = StateProvider((ref) => 0);

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

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

    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(title: const Text('FlutterZero')),
        floatingActionButton: FloatingActionButton(
          child: Icon(Icons.add),
          onPressed: () =>
              ref.read(counterProvider.notifier).update(((state) => ++state)),
        ),
        body: Center(
          child: Text(
            count.toString(),
            style: TextStyle(fontSize: 30),
          ),
        ),
      ),
    );
  }
}

一緒に読みたい

参考

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