Flutter下拉按钮报错：'String'无法转为'index'的'int'类型

错误原因 #

抛出TypeError: type 'String' is not a subtype of type 'int' of 'index'的核心原因是列表元素类型不统一：

• 初始cities是字符串列表：['Select City']
• 接口请求返回的data是Map对象列表（每个元素是带name字段的Map）

组件初始化阶段，接口还未返回数据时，会遍历初始的字符串列表，执行category['name']——但字符串的索引只能是整数，用字符串'name'当索引就会触发类型错误。另外不排除接口更新后返回的数据结构发生变化（比如原本直接返回列表，现在嵌套在某个字段下），导致赋值后的cities类型或结构不符合预期。

修复方案 #

方案1：统一列表元素类型 #

将初始cities改为Map列表，和接口返回数据结构保持一致：

// 初始值改为包含name字段的Map
List<Map<String, dynamic>> cities = [{'name': 'Select City'}];

后续接口返回的Map列表直接覆盖或追加即可，遍历取category['name']时不会再触发类型错误。

方案2：兼容不同类型的列表元素 #

如果不想修改初始列表类型，可在遍历判断元素类型，分别处理：

DropdownButton(
  hint: const Text("Select City"),
  value: _selectedCity,
  items: cities.map((category) {
    String cityName;
    // 判断元素是字符串还是Map，分别取值
    if (category is String) {
      cityName = category;
    } else {
      cityName = category['name'] ?? ''; // 加空值避免空指针
    }
    return DropdownMenuItem(
      value: cityName,
      child: Text(cityName),
    );
  }).toList(),
  onChanged: (value) { 
    setState(() { 
      _selectedCity = value as String?; 
    }); 
  }
)

方案3：检查接口返回数据结构（若接口更新导致） #

如果接口更新后返回的不再是直接的列表，而是嵌套结构（比如{"data": [{"name": "北京"}, ...]}），需要修正解析逻辑：

Future _getCities() async {
  var url = "baseurl/api/v1/cities";
  try {
    var response = await http.get(Uri.parse(url));
    if (response.statusCode == 200) {
      var data = json.decode(response.body);
      setState(() {
        // 假设列表在data字段下，先取到列表再插入初始提示项
        List cityList = data['data'] ?? [];
        cities = [{'name': 'Select City'}, ...cityList];
      });
    }
    print(cities);
  } catch (e) {
    print("Error: $e");
  }
}

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