flutter(dart) + Firestoreでのprintについて

Question

flutter初心者です。

FireStore上のデータ（Document数）を取得してきたいのですが、
getDocCountの中では期待している数値が取得できるのですが、
下記のSecondRouteクラスの呼び出し元では値が取得できません。

おそらく、async awaitの問題かと思っておりますが、どのように実装すれば良いのかがわかりません。
getDocCountの返り値を渡すにはどのようにすれば良いのかご教示ください。

Future<String> getDocCount(String collection) async {
  final dCount = await UserDatastore.getDocuments(collection);
  final doccount = dCount.documents.length.toString();
  //ここではうまく表示できる
  print(doccount);
  qCount = doccount;
  return doccount;
}

class SecondRoute extends StatelessWidget {
  @override
  Widget build(BuildContext context) {

    //ここでnullになる
    //document数を取得
    print(getDocCount('question'));

Answer 1

まず、非同期処理というものを勉強すると良いと思います。

Future<String>という型がなにを表しているのか、async,awaitは何をしているのか。

その勉強が必要です。

それはさておき、このようなコードになるはずです。

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

// DB用意するのは面倒なので省略します
class DummyFirestoreRepository {
  Future<int> getCount(String document) async => await Future.value(100);
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key}) : super(key: key);

  final DummyFirestoreRepository repos = DummyFirestoreRepository();

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  int _documentCount = 0;

  @override
  void initState() {
    super.initState();
    initCount();
    // 短い処理なので、initCount 関数を作らずに以下のようにしてもよい
    // widget.repos
    //  .getCount('hogehoge')
    //  .then((count) => setState(() => _documentCount = count));
  }

  Future<void> initCount() async {
    final int count = await widget.repos.getCount('hogehoge');
    setState(() => _documentCount = count);
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          title: Text('Future Demo Project'),
        ),
        body: Center(
          child: Text(
            '$_documentCount',
            style: Theme.of(context).textTheme.headline4,
          ),
        ));
  }
}

docCountは非同期に実行されるため、時間経過によって変化する"状態"であるため、これを表示するWidgetはStatelessではありません。

状態を管理してくれるProviderを扱えるモジュールをつかうか、上記のようにStatefulWidgetを使う必要があります。

Comments

[kensukekimura]

ありがとうございます。
非同期については理解しているつもりだったのですが参考になるサイトがなかなか見つからずに困っておりました。

記載頂いた内容を元にしっかり勉強します！