在Flutter Dart Firestore应用程序中实现收藏夹按钮

Question

我需要一些帮助，我正在一个电子商务应用程序中开发一个产品页面，其中有一个收藏夹按钮，可以添加到收藏夹产品中或从收藏夹产品中删除。

我的代码的问题是，boolean _isFavorite在屏幕构建完成后返回，并且抛出了Failed断言：boolean表达式不能为null。

在这种情况下，我如何改进我的代码并使其按预期工作？

我有一个添加函数和一个删除函数，如下所示；

// adds a product to users favorite list
addFavorite(String currentUserID, Food currentFood) async {
var _ref = _db.collection(_userFavoritesCollection);
try {
var _docRef = _db.collection(_userFavoritesCollection).doc(currentUserID);
_ref.doc(currentUserID).get().then((DocumentSnapshot documentSnapshot) {
if (documentSnapshot.exists) {
// adds favorite if to existing product favorite map
return _docRef.update({
'favoriteProducts.${currentFood.id}': {
"productName": currentFood.name,
"productPrice": currentFood.price,
"productImageUrl": currentFood.image,
}
});
} else {
// adds favorite if it does not exists
return _docRef.set({
"favoriteProducts": {
currentFood.id: {
"productName": currentFood.name,
"productPrice": currentFood.price,
"productImageUrl": currentFood.image,
}
},
});
}
});
} catch (e) {
print(e);
}
}
// removes favorite produc item form users favorite list
removeFavorite(String currentUserID, Food currentFood) {
var _ref = _db.collection(_userFavoritesCollection);
return _ref
.doc(currentUserID)
.update({'favoriteProducts.${currentFood.id}': FieldValue.delete()})
.then((value) => print('favorite item removed'))
.catchError((error) => print('Feild to remove favorite item: $error'));
}

然后我有一个函数，它检查产品是否已经在收藏夹中，并为按钮返回一个布尔值，以决定按下时要流动的函数。

// check if product is already in the users favorite list
bool checkIfIsFavorite(String currentUserID, Food currentFood) {
bool _isFavorite;
_db
.collection(_userFavoritesCollection)
.doc(currentUserID)
.get()
.then((value) {
if (value.data()['favoriteProducts'][currentFood.id] != null) {
print('Product is favorite for this user');
_isFavorite = true;
} else {
print('Product is NOT a favorite for this user');
_isFavorite = false;
}
});
return _isFavorite;
}
}

产品屏幕页面；

// check if the product is already in the favorites list
bool _isFavorite = DBService.instance
.checkIfIsFavorite(currentUser.user.uid, foodNotifier.currentFood);
// button on pressed
onPressed: _isFavorite
? () {
DBService.instance.addFavorite(
currentUser.user.uid,
foodNotifier.currentFood);
}
: () {
DBService.instance.removeFavorite(
currentUser.user.uid,
foodNotifier.currentFood);
},

据我所知，is代码的问题在于，在构建屏幕并抛出Failed断言：boolean表达式不得为null后，boolean _isFavorite返回。

在这种情况下，我如何改进我的代码并使其按预期工作？

Answer 1

如果您不想在加载_isFavorite之前显示该按钮，请尝试将按钮包装在CCD_ 2中，然后在快照具有数据时返回按钮。

FutureBuilder(
future: DBService.instance
.checkIfIsFavorite(currentUser.user.uid, foodNotifier.currentFood);
builder: (context, snapshot){
if(!snapshot.hasData){
return SizedBox();
}
bool _isFavorite = snapshot.data;
return RaisedButton(
child: Text("Fav Button"),
onPressed: _isFavorite? 
() {
DBService.instance.addFavorite(
currentUser.user.uid,foodNotifier.currentFood);
}
: () {
DBService.instance.removeFavorite(
currentUser.user.uid,
foodNotifier.currentFood);
},
}
);

如果您想在加载_isFavorite之前禁用该按钮，请尝试以下操作：

FutureBuilder(
future: DBService.instance
.checkIfIsFavorite(currentUser.user.uid, foodNotifier.currentFood);
builder: (context, snapshot){
var _isFavorite = snapshot.data;
return RaisedButton(
child: Text("Fav Button"),
onPressed: _isFavorite == null ? null : ? 
() {
DBService.instance.addFavorite(
currentUser.user.uid,foodNotifier.currentFood);
}
: () {
DBService.instance.removeFavorite(
currentUser.user.uid,
foodNotifier.currentFood);
},
}
);