私は羽ばたきをするのが初めてですが、これはおそらく簡単な質問ですが、未来と未来のビルダーをより理解するのに役立つ少しの説明を探しています。(ユーザーが前の画面で何をクリックしたかに応じて)firebaseにクエリを実行しようとしていますが、何かが表示される前にすべてのデータがロードされるのを待ちたいのですが。これを行うには、大幅に変更されないいくつかの製品を紹介するので、将来のビルダーが最も適切だと思いました。getData関数を作成しました。
Future getCardData() async {
return await Firestore.instance.collection('cards')
.where('Event', isEqualTo: widget.documentid).snapshots();
}
}
そしてそれをここに実装しました:
body: FutureBuilder(
future: getCardData(),
builder: (context, snapshot) {
if (!snapshot.hasData) {
return Center(child: const Text('Loading...'));
}
return GridView.builder(
shrinkWrap: true,
gridDelegate:
SliverGridDelegateWithFixedCrossAxisCount(crossAxisCount: 2),
itemCount: snapshot.data.length,
itemBuilder:
(BuildContext context, int index) {
print(snapshot.data.documents[index].data['img_url']);
return Padding(
padding: const EdgeInsets.all(8.0),
child: Container(
height: MediaQuery.of(context).size.height / 6,
child: Center(
child: Card(
elevation: 8.0,
child: Image(
image: FirebaseImage(snapshot.data.documents[index].data['img_url']),
),
)
),
),
);
},
);
},
),
しかし、(GridView.buiderのitemCount部分であると想定していることから)次のエラーが発生します。
type 'Future<int>' is not a subtype of type 'int'
この将来の値にアクセスし、残りのコードを調整して、画像が表示される前にデータが読み込まれるのを待つ方法を考えています。
snapshots()
を返すためStream
、次のように変更しgetDocuments()
ます。
Future<QuerySnapshot> getCardData() async {
return await Firestore.instance.collection('cards')
.where('Event', isEqualTo: widget.documentid).getDocuments();
}
次にitemCount
、次の操作を実行できます。
itemCount: snapshot.data.documents.length,
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加