Flutter如何从Map<String,String>生成带图片的DropdownMenuItem列表并解决报错

• 你的DropdownMenuItem没有显式设置value属性，所有选项的value默认都是null
• DropdownButton本身没有指定当前选中的value参数，默认也是null
• 断言校验会统计所有value等于当前选中值的选项数量，此时所有选项都匹配null，数量远大于1，触发报错

1. 首先在你的State类中定义一个变量存储当前选中的鸡尾酒名称，初始值可以选Map里的某一个key

// 定义在State类中
String? _selectedDrink = 'Bloody Mary'; // 初始值必须是drinkNameToImage里存在的key

2. 给每个DropdownMenuItem设置value属性，值为对应的鸡尾酒名称
3. 给DropdownButton设置value属性绑定刚才定义的_selectedDrink，同时实现onChanged回调更新选中值
4. 优化遍历Map的方式，用entries遍历更易读，不用单独通过索引取key和value

完整修复后代码如下：

// 定义在State类中
String? _selectedDrink = 'Bloody Mary';

Widget build(BuildContext context) {
  return DropdownButton<String>(
    // 绑定当前选中值
    value: _selectedDrink,
    // 实现选中回调
    onChanged: (newValue) {
      setState(() {
        _selectedDrink = newValue;
      });
    },
    items: drinkNameToImage.entries.map((entry) {
      return DropdownMenuItem<String>(
        // 给每个选项设置唯一value
        value: entry.key,
        child: Container(
          padding: const EdgeInsets.only(bottom: 5.0),
          height: 100.0,
          child: Row(
            mainAxisAlignment: MainAxisAlignment.spaceEvenly,
            children: <Widget>[
              Image(image: AssetImage(entry.value)),
              Text(entry.key)
            ],
          ),
        ),
      );
    }).toList(),
  );
}

• 初始的_selectedDrink的值必须是drinkNameToImage中存在的key，不能是Map里没有的数值，否则会继续触发相同断言
• 不推荐设置无初始选中的状态，如果初始值设为null，需要额外处理逻辑避免匹配不到选项触发断言
• 显式给DropdownButton和DropdownMenuItem指定泛型String可以避免后续类型匹配错误
• 如果你确实需要禁用下拉选择，保持onChanged: null即可，只要提前给value和每个DropdownMenuItem设置了匹配的唯一值，就不会触发报错

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