如何将单个小部件与多个提供程序一起使用？

Posted 2023-02-23

【中文标题】如何将单个小部件与多个提供程序一起使用？

【英文标题】：How to use single widget with multiple providers?

【发布时间】：2020-08-25 03:42:57

【问题描述】：

我的应用是电子商务商店，仪表板有多个列表：LatestProducts、DiscountProducts、MostViewedProduct、...

我创建了多个提供者：LatestProductProvider、DiscountProductProvider、MostViewedProductProvider （实际上具有过滤参数的相同提供程序会获得不同的排序产品）

我不想为每个产品列表创建多个小部件。我的主要小部件重用了这个单一的小部件类：

 class _ProductsWidget extends StatelessWidget 
  const _ProductsWidget( Key key, @required this.filter,) : super(key: key);
  final String filter;

 @override
Widget build(BuildContext context) 
   dynamic productProvider = null;
   if (filter == '0') productProvider = Provider.of<LatestProductProvider>(context);
   if (filter == '1') productProvider = Provider.of<DiscountProductProvider>(context);
   if (filter == '2') productProvider = Provider.of<MostViewedProductProvider>(context);
   return SliverToBoxAdapter(
     child: ...
        ...
        //use matched productProvider

如何对上述场景进行编码？ 当我测试我的代码时，我的列表会加载并行数据。这张图片是我的结果：

Result in image

【参考方案1】：

过滤模型中的最新、打折和浏览次数最多的产品。然后，您将创建一个 storeproducts 对象。

class StoreProducts
final List<Product> latest;
final List<Product> mostViewed;
final List<Product> discounted;
//if needed
final List<Product> otherProducts;

StoreProducts(this.latest,this.mostViewed,this.discounted);

【讨论】：

您好，您建议我使用 One 提供商。但我想要一个具有多提供商模型的小部件。