问颤振等待在initState中不等待
EN

Stack Overflow用户

提问于 2022-03-04 17:25:27

回答 1查看 445关注 0票数 0

我是新手，所以我不确定我的编码方法是否正确。

我正在尝试从firebase获取数据，并希望将其加载到initState()中。但是，它不能等待。在等待的过程中，它开始建立。如何在生成之前加载数据。谢谢

这些是密码和日志。

import 'dart:async';

import 'package:cloud_firestore/cloud_firestore.dart';
import 'package:flutter/material.dart';
import 'package:flutter_app/entity/quiz.dart';

import '../result.dart';

class Question extends StatefulWidget {
  @override
  _QuestionState createState() => _QuestionState();
}

class _QuestionState extends State<Question> {
  @override
  void initState() {
    print("init State");
    super.initState();
    Future(() async {
      await Future.delayed(Duration(seconds: 5));
    });
    setQuiz();
  }

  List<Quiz> quiz = [];

  Future<void> setQuiz() async {
    // 検索結果は、一旦はFuture型で取得
    Future<QuerySnapshot<Map<String, dynamic>>> snapshot =
        FirebaseFirestore.instance.collection("quiz").get();
    print("inSetQuiz");

    // ドキュメントを取得
    quiz = await snapshot.then(
        (event) => event.docs.map((doc) => Quiz.fromDocument(doc)).toList());
    // await snapshot.then((value) {
    //   setState(() {
    //     quiz = value.docs.map((doc) => Quiz.fromDocument(doc)).toList();
    //   });
    // });

    print("afterSetQuiz");
    print("hoge" + quiz.length.toString());

    print("hoge" + quiz.elementAt(0).sentence);
  }

  // 問題番号
  int questionNumber = 0;

  // 正解問題数
  int numOfCorrectAnswers = 0;

  @override
  Widget build(BuildContext context) {
    print("in build");
    return Scaffold(
        appBar: AppBar(
          title: Text("問題ページ"),
        ),
        body: Center(
            child:
                Column(mainAxisAlignment: MainAxisAlignment.start, children: [
          Container(
            height: 50,
            color: Colors.red,
            child: const Center(
              child: Text(
                "一旦",
                style: TextStyle(fontSize: 20),
              ),
            ),
          ),
          Container(
              padding: const EdgeInsets.all(8.0),
              child: Text(
                quiz.elementAt(questionNumber).sentence, ←error happens
                style: TextStyle(fontSize: 20),
              )),
omit

这里记录↓

flutter: init State
flutter: inSetQuiz
flutter: in build

它在等待功能之前加载构建。

flutter

async-await

回答 1

Stack Overflow用户

回答已采纳

发布于 2022-03-04 18:13:20

您不应该阻止initState方法。这条直接来自颤振错误的消息说明了这一切：“initState方法必须是一个没有异步关键字的void方法；与其直接在initState中等待异步工作，不如调用一个单独的方法来完成这项工作，而无需等待它”。

这就是FutureBuilder的作用所在。我会用这种方式重构应用程序：

保持您的setQuiz方法异步，但返回的不是空的未来，而是包装此方法返回的数据的未来<代码>E 215(在您的示例中，是一个测试)。

Future<List<Quiz>> setQuiz() {

  // your existing code, just at the end do:
  return quiz;
}

FutureBuilder小部件中的setQuiz异步方法的返回：

@override
  Widget build(BuildContext context) {
    print("in build");
    return Scaffold(
        appBar: AppBar(
          title: Text("問題ページ"),
        ),
        body: FutureBuilder(
          future: setQuiz(),
          builder: (context, snapshot) {
            
             if (snapshot.hasData) {
   
               // out of the FutureBuilder's snapshot, collect the data
               var quiz = snapshot.data as List<Quiz>;

               // build your quiz structure here
               return Center(
                  child: Column(
                    mainAxisAlignment: MainAxisAlignment.start,
                    children: [
                      Container(
                         height: 50,
                         color: Colors.red,
                         child: const Center(
                            child: Text("一旦",
                              style: TextStyle(fontSize: 20),
                            ),
                         ),
                       ),
                       ListView.builder(
                         itemCount: quiz.length,
                         itemBuilder: (context, index) {
                            var singleQuestion = quiz[index];    
                            
                            return Text(singleQuestion.sentence);                     
                         }
                       )
                     ]
                   )
                 );
             }
             
             // while waiting for data to arrive, show a spinning indicator
             return CircularProgressIndicator();
          }
        )
    );
}