如何从Firebase中删除颤动卡

Question

我正在构建一个应用程序，在那里我可以在卡片上列出即将到来的足球比赛，并将比赛存储在Firebase中。卡片上有一个删除按钮，弹出窗口要求确认删除。我怎么才能不仅从列表中删除卡片，还从firebase中删除。这是卡片的代码：

import 'package:cloud_firestore/cloud_firestore.dart';
import 'package:flutter/material.dart';
import 'package:foci_dev/model/next_matches.dart';
import 'package:foci_dev/pages/delete_page.dart';
import 'package:foci_dev/service/database_service.dart';
class DeleteCard extends StatelessWidget {
final UpcomingMatch nextMatch;
final cardId;
DeleteCard(this.nextMatch, this.cardId);
final DatabaseService _db = new DatabaseService(Firestore.instance);
@override
Widget build(BuildContext context) {
return Padding(
padding: const EdgeInsets.all(8.0),
child: Card(
color: Colors.grey[900],
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(5)),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceAround,
children: <Widget>[
Text(
"${nextMatch.upcomingTeam1}",
style: TextStyle(color: Colors.white60),
),
Text(
'-',
style: TextStyle(color: Colors.white60),
),
Text(
"${nextMatch.upcomingTeam2}",
style: TextStyle(color: Colors.white60),
),
IconButton(
icon: Icon(Icons.delete),
onPressed: () {
showDialog(
context: context,
builder: (BuildContext context) {
return AlertDialog(
title: Text(
'Biztos?',
style: TextStyle(color: Colors.red),
),
content: Text("Ki akarod törölni a meccset?"),
actions: [
FlatButton(
onPressed: () {
Navigator.of(context).pop();
},
child: Text(
'Nem',
style: TextStyle(color: Colors.red),
)),
FlatButton(
onPressed: () {
deleteMatch(cardId);
},
child: Text(
'Igen',
style: TextStyle(color: Colors.green),
))
],
);
});
},
color: Colors.white60,
)
],
),
),
);
}
Future<void> deleteMatch(id) async {
await Firestore.instance.collection("upcomings").document(id).delete();
}
}

这是页面本身的代码：

import 'package:cloud_firestore/cloud_firestore.dart';
import 'package:flutter/material.dart';
import 'package:foci_dev/model/next_matches.dart';
import 'package:foci_dev/pages/new_match_page.dart';
import 'package:foci_dev/service/database_service.dart';
import 'package:foci_dev/ui/delete_card.dart';
import 'main_page.dart';
class DeletePage extends StatefulWidget {
@override
_DeletePageState createState() => _DeletePageState();
final DatabaseService databaseService;
DeletePage(this.databaseService);
}
class _DeletePageState extends State<DeletePage> {
DatabaseService _databaseService = DatabaseService(Firestore.instance);
@override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: Colors.grey[800],
appBar: AppBar(
backgroundColor: Colors.grey[900],
centerTitle: true,
title: const Text(
'Foci-admin',
style: TextStyle(color: Colors.white60),
),
leading: Padding(
padding: const EdgeInsets.all(8.0),
child: IconButton(
icon: Icon(
Icons.edit,
color: Colors.white60,
),
onPressed: () {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => NewMatch(this._databaseService),
));
},
tooltip: 'Meccsek hozzáadása',
),
),
actions: <Widget>[
Padding(
padding: const EdgeInsets.all(8.0),
child: IconButton(
icon: Icon(
Icons.home,
color: Colors.white60,
),
onPressed: () {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => MainPage(),
));
},
tooltip: 'Eredmény',
),
)
],
),
body: StreamBuilder(
stream: Firestore.instance
.collection("upcomings")
.orderBy('createdAt')
.snapshots(),
builder: (BuildContext context, AsyncSnapshot snapshot) {
return snapshot.hasData
? Container(
color: Colors.grey[850],
child: ListView.builder(
itemCount: snapshot.data.documents.length,
itemBuilder: (BuildContext context, int index) {
DocumentSnapshot upcomings =
snapshot.data.documents[index];
UpcomingMatch upcomingMatch = UpcomingMatch(
upcomings["upcomingTeam1"],
upcomings["upcomingTeam2"]);
return DeleteCard(upcomingMatch,
snapshot.data.documents[index].documentId);
}),
)
: Center(
child: CircularProgressIndicator(),
);
},
),
);
}
}

谢谢你的帮助，我知道我应该展示我尝试过的代码，但我真的是Flutter和Firebase的新手，我真的不知道如何开始。我唯一的想法是，我需要以某种方式将文档ID传递给DeleteCard类，但我被困在了这里，因为我不知道如何做到这一点。

Answer 1

cloud_firestore版本0.14.0+1 的答案

您可以将snapshot.data.documents[index].id或snapshot.ddata.documents[index].docentID(对于旧版本(传递给DeleteCard小部件，然后使用它从Firestore中删除卡。

DeleteCard(upcomingMatch , snapshot.data.documents[index].id)
OR
DeleteCard(upcomingMatch , snapshot.data.documents[index].documentID) // older version

DeleteCard构造函数应该看起来像这个

DeleteCard(this.nextMatch , this.cardId);

在得到AlertDialog的确认后，调用deleteMatch(cardId(

Future<void> deleteMatch(id) async{
await Firestore.instance.collection("upcomings").doc(id).delete();

OR
//older version
await Firestore.instance.collection("upcomings").document(id).delete(); 
}