检索数据和产品页面firestore时出现提供程序错误

Question

我正在产品页面顶部添加一个收藏夹按钮。我想要收藏夹按钮将产品详细信息添加到收藏夹小部件中。

因此，我在statfulWidget上放置了最喜欢的按钮，用于检索产品详细信息。

在放置AddFavorite更改通知程序后，根目录不允许我再从产品中检索数据，说明提供者中存在错误。

ProviderNotFoundException (Error: Could not find the correct Provider<Food> above this FoodDetail Widget 
Make sure that FoodDetail is under your MultiProvider/Provider<Food>.
This usually happen when you are creating a provider and trying to read it immediately

我不明白为什么FoodDetail应该在Provider中，而在添加用于检索数据的按钮之前，这是不必要的。

MultiProvider(
providers: [
ChangeNotifierProvider(
create: (context) => AuthNotifier(),
),
ChangeNotifierProvider(
create: (context) => FoodNotifier(),
),
ChangeNotifierProvider(
create: (context) => AddFavorite(),
),

class FoodDetail extends StatefulWidget {


FoodDetail({Key key, this.item}) : super(key: key);
final Item item;
@override
_FoodDetailState createState()=> _FoodDetailState();

}
class _FoodDetailState extends State<FoodDetail>{

Item item;
@override
Widget build(BuildContext context) {
FoodNotifier foodNotifier = Provider.of<FoodNotifier>(context);

_onFoodDeleted(Food food) {
Navigator.pop(context);
foodNotifier.deleteFood(food);
}
var isInCart = context.select<Food, bool>(
// Here, we are only interested whether [item] is inside the cart.
(cart) => cart.items.contains(item),
);
return Scaffold(
appBar: GradientAppBar(
title: Text(foodNotifier.currentFood.name),
actions: <Widget>[
FlatButton(
onPressed: isInCart
? null
: () { 
var cart = context.read<AddFavorite>();
cart.add(item);
},
splashColor: Theme.of(context).primaryColor,
child: isInCart ? Icon(Icons.star, color: Colors.yellow[500]) : Icon(Icons.star_border, color: Colors.yellow[500]),
),
],

class AddFavorite extends ChangeNotifier {
/// The private field backing [catalog].
Food _food;
/// Internal, private state of the cart. Stores the ids of each item.
final List<int> _itemIds = [];
/// The current catalog. Used to construct items from numeric ids.
Food get food => _food;
set food(Food newFood) {
assert(newFood != null);
assert(_itemIds.every((id) => newFood.getById(id) != null),
'The catalog $newFood does not have one of $_itemIds in it.');
_food = newFood;
// Notify listeners, in case the new catalog provides information
// different from the previous one. For example, availability of an item
// might have changed.
notifyListeners();
}
/// List of items in the cart.
List<Item> get items => _itemIds.map((id) => _food.getById(id)).toList();

/// Adds [item] to cart. This is the only way to modify the cart from outside.
void add(Item item) {
_itemIds.add(item.id);
// This line tells [Model] that it should rebuild the widgets that
// depend on it.
notifyListeners();
}
}

Answer 1

我找到了解决方案，问题是需要将变量放置在无状态小部件中。

class _AddButton extends StatelessWidget {
final Item item;
const _AddButton({Key key, @required this.item}) : super(key: key);

@override
Widget build(BuildContext context) {
var isInCart = context.select(
// Here, we are only interested whether [item] is inside the cart.
(cart) =>cart.items.contains(item),
);
return  FlatButton(
onPressed: isInCart
? null
: () { 
var cart = context.read();
cart.add(item);
},
splashColor: Theme.of(context).primaryColor,
child: isInCart ? Icon(Icons.star, color: Colors.yellow[500]) : Icon(Icons.star_border, color: Colors.yellow[500]),
);
}
}