将 RefreshIndicator 与 FutureBuilder 一起使用（QuerySnapshot 问题）答案

【问题标题】：Using RefreshIndicator with FutureBuilder (QuerySnapshot issue)将 RefreshIndicator 与 FutureBuilder 一起使用（QuerySnapshot 问题）
【发布时间】：2021-10-06 22:59:54
【问题描述】：

我正在尝试在未来的构建器上使用刷新指示器小部件实现拉动刷新操作。我已经设法让它正确加载，但是当我尝试通过拉动刷新来刷新列表时，无法通过我当前面临的问题。

late Future<QuerySnapshot> postsList;

初始化数据

void initState() {
  super.initState();

  postsList = loadPostsList();
}

从 firestore 函数加载数据

Future<QuerySnapshot> loadPostsList() async {
  print('Refreshing Post List...');
  keyRefresh.currentState?.show();

  final QuerySnapshot data = await FirebaseFirestore.instance
      .collection('Posts')
      .orderBy('createdAt', descending: true)
      .get();

  return data;
}

现在这是我卡住的地方，我想将 setState(() => this.postsList = data); 添加到 loadPostsList() 函数中，如下所示：

Future<QuerySnapshot> loadPostsList() async {
  print('Refreshing Post List...');
  keyRefresh.currentState?.show();

  final QuerySnapshot data = await FirebaseFirestore.instance
      .collection('Posts')
      .orderBy('createdAt', descending: true)
      .get();

  // HERE
  setState(() => this.postsList = data);

  return data;
}

但收到此错误：

“QuerySnapshot

感谢任何帮助，因为我是 Flutter 的新手，还在学习:)，下面是完整的代码：

final keyRefresh = GlobalKey<RefreshIndicatorState>();
late Future<QuerySnapshot> postsList;

@override
void initState() {
  super.initState();

  postsList = loadPostsList();
}

Future<QuerySnapshot> loadPostsList() async {
  print('Refreshing Post List...');
  keyRefresh.currentState?.show();

  final QuerySnapshot data = await FirebaseFirestore.instance
      .collection('Posts')
      .orderBy('createdAt', descending: true)
      .get();

  return data;
}

FutureBuilder<QuerySnapshot>(
  future: postsList,
  builder: (context, snapshot) {
    if (snapshot.hasData) {
      final List<DocumentSnapshot> documents =snapshot.data!.docs;

      return RefreshIndicator(
        key: keyRefresh,
        color: Colors.blue,
        onRefresh: loadPostsList,
        child: SingleChildScrollView(
          physics: AlwaysScrollableScrollPhysics(),
          child: Column(
            children: documents.map((doc) => new PostCard(
              author: doc['author'],
              title: doc['title'],
              description: doc['desc'],
            ),
          ).toList(),
        ),
      );
    } else if (snapshot.hasError) {
      return Text('Error!');
    } else {
      return LoadingWidget();
    }
  },
),

【问题讨论】：

标签： android flutter dart google-cloud-firestore flutter-futurebuilder

【解决方案1】：

错误是因为您将data 定义为QuerySnapshot 类型，并试图将其分配给您定义为Future<QuerySnapshot> 类型的postsList。显然，它们是不同的类型，因此您不能将一种分配给另一种。

不要从loadPostsList 内部调用setState。使用类似的东西：

onRefresh: () async {
  setState(() {
    postsList = loadPostsList();
  });
}

【讨论】：