Flutter多选项搜索界面实现及数据过滤代码解决方案
Flutter Chip筛选Player数据的过滤逻辑实现
需求说明
需要完善getData方法的过滤逻辑,满足:
- 当
_selectedCountries和_selectedSports均为空时,返回null - 当前选中条件(国家:England、India;运动:FootBall、Chess、Tennis)下,返回指定的3条Player记录(注意原数据中Gerrard的sport字段为
Football,与选中值FootBall存在大小写差异,需兼容处理)
完整实现代码
List<Player>? getData() { List<Player> players = [ Player(name: 'David', sport: 'FootBall', country: 'England'), Player(name: 'Anand', sport: 'Chess', country: 'India'), Player(name: 'Martina', sport: 'Tennis', country: 'Switzerland'), Player(name: 'Kohli', sport: 'Cricket', country: 'India'), Player(name: 'Carlsen', sport: 'Chess', country: 'Norway'), Player(name: 'Gerrard', sport: 'Football', country: 'England'), Player(name: 'Agasi', sport: 'Tennis', country: 'U.S'), Player(name: 'S Graph', sport: 'Tennis', country: 'Germany'), ]; List<String> _selectedCountries = ['England', 'India']; List<String> _selectedSports = ['FootBall', 'Chess', 'Tennis']; // 当两个选中列表均为空时返回null if (_selectedCountries.isEmpty && _selectedSports.isEmpty) { return null; } List<Player> filteredList = players.where((player) { // 国家匹配:选中列表为空则所有国家都符合,否则检查是否在选中列表内 bool isCountryMatched = _selectedCountries.isEmpty ? true : _selectedCountries.contains(player.country); // 运动匹配:统一大小写兼容原数据的大小写差异,选中列表为空则所有运动都符合 bool isSportMatched = _selectedSports.isEmpty ? true : _selectedSports.any((selectedSport) => selectedSport.toLowerCase() == player.sport.toLowerCase()); // 同时满足国家和运动匹配条件 return isCountryMatched && isSportMatched; }).toList(); return filteredList; } // 补充Player类定义(方便代码运行) class Player { final String name; final String sport; final String country; Player({required this.name, required this.sport, required this.country}); }
关键逻辑说明
- 空值判断:优先检查两个选中筛选条件是否都为空,直接返回
null,符合需求要求 - 多条件过滤:将国家和运动的匹配逻辑拆分,分别处理选中列表为空的情况(支持单条件筛选,比如只选国家或只选运动)
- 大小写兼容:通过
toLowerCase()统一转换为小写后再匹配,解决原数据中Gerrard的Football与选中值FootBall的大小写差异问题,确保不会漏筛目标记录
内容的提问来源于stack exchange,提问作者user22362195
相关产品推荐
相关产品推荐

