Flutter/Dart中如何将JSON列表项添加到带搜索功能的下拉选单中

我来帮你搞定这两个问题，咱们一步步拆解：

问题1：索引类型不匹配错误 #

你遇到的The argument type 'String' can't be assigned to the parameter type 'int'错误，原因很简单：countries是一个列表（List），列表只能用整数作为索引（比如countries[0]取第一个元素），但你写了countries['name']，试图用字符串当索引，这肯定不对。

如果只是单纯想获取所有国家名称的列表，你可以用map转换：

countries.map((country) => country['name']).toList()

不过这样改只能解决第一个问题，没法拿到选中国家的ID，所以咱们直接一步到位，用更合理的方式处理。

问题2：选中时获取对应ID #

要实现选中国家后打印ID，不能只把名称传给下拉框，得让DropdownSearch处理整个国家对象（也就是列表里的每个Map），这样选中时才能拿到完整的信息。具体修改如下：

1. 把DropdownSearch的泛型从<String>改成<Map<String, dynamic>>，告诉组件我们要处理的是Map类型的对象；
2. items直接传整个countries列表，不用再单独提取名称；
3. 添加itemAsString参数，指定下拉框要显示对象里的name字段；
4. onChanged回调里，参数就是选中的国家对象，直接从中取出id打印即可；
5. selectedItem也要改成对应的国家对象，用firstWhere找到名称为"Canada"的元素。

修改后的完整代码 #

body: Column(
  children: [
    DropdownSearch<Map<String, dynamic>>(
      mode: Mode.MENU,
      items: countries,
      itemAsString: (item) => item['name'], // 指定下拉框显示的字段
      showSearchBox: true,
      label: "Menu mode",
      hint: "country in menu mode",
      onChanged: (selectedCountry) {
        if (selectedCountry != null) {
          print(selectedCountry['id']); // 打印选中国家的ID
        }
      },
      selectedItem: countries.firstWhere((c) => c['name'] == 'Canada'),
    ),
  ],
),

这样改完之后，两个问题就都解决了：下拉框正常显示国家名称，搜索功能也能正常工作，选中任意国家时控制台会打印对应的ID~

内容的提问来源于stack exchange，提问作者MURALI KRISHNAN MT