如何解决Flutter多级下拉切换国家时的DropdownMenuItem重复值错误？

这个错误的核心原因很明确：你选中某省份后切换国家时，之前的selectedProvince值仍保留，但该值不在新切换国家的省份列表中，而DropdownButton要求value必须是下拉选项中的某一项，不匹配就会触发报错。另外你代码里写的selectedProvince != 'null';是逻辑判断语句，根本没起到重置选中值的作用。

直接看修复后的代码：

class _HomePageState extends State<HomePage> {
  List<String> countries = ['USA', 'India'];
  List<String> indiaProvince = ['New Delhi', 'Bihar', 'Rajasthan'];
  List<String> usaProvince = ['Texas', 'Florida', 'California'];

  List<String> provinces = [];
  String? selectedCountry;
  String? selectedProvince;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('Multi Level Dropdown'),
      ),
      body: ListView(
        padding: const EdgeInsets.all(20.0),
        children: [
          // 国家下拉框
          DropdownButton<String>(
            hint: const Text('Country'),
            value: selectedCountry,
            isExpanded: true,
            items: countries.map((String value) {
              return DropdownMenuItem<String>(
                value: value,
                child: Text(value),
              );
            }).toList(),
            onChanged: (country) {
              // 先更新对应国家的省份列表
              if (country == 'USA') {
                provinces = usaProvince;
              } else if (country == 'India') {
                provinces = indiaProvince;
              } else {
                provinces = [];
              }
              setState(() {
                selectedCountry = country;
                // 关键：切换国家时重置选中的省份为null，让下拉回到提示状态
                selectedProvince = null;
              });
            },
          ),
          // 省份下拉框
          DropdownButton<String>(
            hint: const Text('Province'),
            value: selectedProvince,
            isExpanded: true,
            items: provinces.map((String value) {
              return DropdownMenuItem<String>(
                value: value,
                child: Text(value),
              );
            }).toList(),
            onChanged: (province) {
              setState(() {
                selectedProvince = province;
              });
            },
          ),
        ],
      ),
    );
  }
}

关键修改说明： #

• 将原来无效的selectedProvince != 'null';替换为selectedProvince = null;，这才是正确的重置选中省份的方式
• 调整了setState内的代码顺序，逻辑更清晰，先更新选中的国家，再重置省份选中值

修改后，切换国家时省份下拉会自动回到初始提示状态，彻底避免了value不匹配的错误，完全满足你「切换国家时重置省份初始值」的需求。

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