Flutter：如何基于Provider传入的Category实现子类别下拉选择？

错误根源 #

你遇到的问题核心是类型不匹配和初始值无效：

• selectval初始为空或为字符串类型，但DropdownMenuItem的value是Subcategory对象，两者类型不匹配
• onChanged中将value转为字符串，进一步加剧了类型不兼容，导致Flutter无法匹配选中项与选项列表

修改步骤 #

1. 修正selectval的类型

在你的State类中，将selectval定义为Subcategory?类型（允许初始值为null）：

Subcategory? selectval;

2. 修改DropdownButton代码

指定泛型类型，统一value类型，添加提示文本并修正onChanged逻辑：

DropdownButton<Subcategory>(
  value: selectval,
  // 初始未选中时显示的提示
  hint: const Text('请选择子类别'),
  onChanged: (Subcategory? value) {
    setState(() {
      // 直接赋值Subcategory对象，无需转字符串
      selectval = value;
    });
  },
  items: subCategories.map((Subcategory item) {
    return DropdownMenuItem<Subcategory>(
      value: item,
      child: Text(item.title),
    );
  }).toList(),
),

3. 确保Subcategory类的相等性判断

DropdownButton通过对象相等性匹配选中项，因此需要在Subcategory类中重写==和hashCode方法：

class Subcategory {
  final String title;

  Subcategory({required this.title});

  @override
  bool operator ==(Object other) =>
      identical(this, other) ||
      other is Subcategory &&
          runtimeType == other.runtimeType &&
          title == other.title;

  @override
  int get hashCode => title.hashCode;
}

效果说明 #

修改后下拉按钮会：

• 初始显示"请选择子类别"的提示文本
• 点击后展示对应Category的所有子类别选项
• 选中后正确显示子类别标题，且不会再出现类型不匹配或重复value的错误

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