Dart开发：无共同关联字段的两个Model如何实现过滤操作

你要实现的是「点击对应店铺，跳转到详情页展示该店铺所有菜单」的需求，现有代码的问题出在第二个页面的过滤逻辑错误，没有正确使用第一个页面传入的关联ID，修改后即可完成非公共字段的过滤，不需要合并数组的辅助类。

具体修改步骤 #

1. 补全第二个页面Exp1的参数接收定义 #

首先你需要在Exp1 StatefulWidget中声明接收第一个页面传入的sid和shopTitle参数：

class Exp1 extends StatefulWidget {
  // 接收第一个页面传入的店铺ID和店铺名称
  final int sid;
  final String shopTitle;
  const Exp1({super.key, required this.sid, required this.shopTitle});

  @override
  State<Exp1> createState() => _Exp1State();
}

2. 修正第二个页面的过滤逻辑 #

删除第二个页面中无用的coffeeShop数组和未初始化的index变量，直接用传入的sid过滤菜单数组即可：

class _Exp1State extends State<Exp1> {
  final List<CoffeeShopMenu> coffeeMenu = <CoffeeShopMenu>[
    CoffeeShopMenu(sid: 1, shopMenuTitle: 'Matcha'),
    CoffeeShopMenu(sid: 1,shopMenuTitle: 'Matcha'),
    CoffeeShopMenu(sid: 4,shopMenuTitle: 'Matcha'),
    CoffeeShopMenu(sid: 4,shopMenuTitle: 'pie'),
    CoffeeShopMenu(sid: 3,shopMenuTitle: 'sandwich'),
    CoffeeShopMenu(sid: 4,shopMenuTitle: 'croissant'),
    CoffeeShopMenu(sid: 5,shopMenuTitle: 'croissant A'),
    CoffeeShopMenu(sid: 5,shopMenuTitle: 'croissant A'),
    CoffeeShopMenu(sid: 2,shopMenuTitle: 'croissant'),
    CoffeeShopMenu(sid: 2,shopMenuTitle: 'Latte'),
    CoffeeShopMenu(sid: 4,shopMenuTitle: 'Latte'),
    CoffeeShopMenu(sid: 3,shopMenuTitle: 'Latte'),
    CoffeeShopMenu(sid: 5,shopMenuTitle: 'Latte'),
  ];

  // 直接用传入的sid过滤菜单，sid对应CoffeeShop的id、CoffeeShopMenu的sid
  List<CoffeeShopMenu> get coffeeMenuTitle => coffeeMenu.where((element) => element.sid == widget.sid).toList();
  
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      // 可以把店铺名设置为页面标题
      appBar: AppBar(title: Text(widget.shopTitle)),
      body: ListView.builder(
        itemCount: coffeeMenuTitle.length,
        itemBuilder: (context, index){
          return ListTile(
            title: Text(coffeeMenuTitle[index].shopMenuTitle),
          );
        }
      ),
    );
  }
}

逻辑说明 #

Dart的where方法本身支持自定义任意匹配规则，不需要两个Model存在同名字段：只要你能明确两个字段的关联关系（这里就是CoffeeShop.id = CoffeeShopMenu.sid），就可以自己写匹配条件完成过滤。
上述方案不需要合并数组，也不受数组长度限制，后续新增店铺、新增菜单都不会触发长度不匹配的错误。

内容的提问来源于stack exchange，提问作者user16357470