Flutter:带有自定义地图的下拉菜单

Question

我有一个地图列表:

var taxesGroups = [
{
"name": "Spain",
"taxes": [
{"name": "IVA", "percentage": "21"},
{"name": "IRPF", "percentage": "19"},
]
},
{
"name": "UK",
"taxes": [
{"name": "VAT", "percentage": "20"},
]
}
];
var dropdownValue = taxesGroups[0]["name"];

到目前为止，我尝试了这个:

DropdownButton(
value: dropdownValue,
items: taxesGroups.map((taxGroup) {
return DropdownMenuItem<String>(
value: taxGroup["name"],
child: Text(taxGroup["name"]),
);
}).toList(),
onChanged: (taxGroup) {
setState(() {
dropdownValue = taxGroup;
});
},
),

我得到这个错误:

type 'List'不是type的子类型"List<DropdownMenuItem&gt">

我猜这与我想在下拉菜单中显示的信息(西班牙，英国)以及我选择一个选项时得到的结果有关，但我不明白

Answer 1

您匹配错了taxesGroups映射。

我试着用这个重新创建你的用例，它工作。

class MyApp2 extends StatefulWidget {
@override
_MyAppState createState() => _MyAppState();
}
class _MyAppState extends State<MyApp2> {
@override
Widget build(BuildContext context) {
return MaterialApp(
home: MyHomePage(),
);
}
}
class MyHomePage extends StatefulWidget {
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
var taxesGroups = [
{
"name": "Spain",
"taxes": [
{"name": "IVA", "percentage": "21"},
{"name": "IRPF", "percentage": "19"},
]
},
{
"name": "UK",
"taxes": [
{"name": "VAT", "percentage": "20"},
]
}
];
var dropdownValue;
@override
void initState() {
dropdownValue = taxesGroups[0];
super.initState();
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text("AppBar"),
),
body: DropdownButton(
value: dropdownValue['name'],
items: taxesGroups.map((taxGroup) {
return DropdownMenuItem<String>(
value: taxGroup["name"],
child: Text(taxGroup["name"]),
);
}).toList(),
onChanged: (taxGroup) {
print('taxGroup $taxGroup');
taxesGroups.map((e) {
if (e["name"] == taxGroup)
setState(() {
dropdownValue = e;
});
});
},
),
);
}
}

Answer 2

为地图添加DropownMenuItem类型

DropdownButton(
value: dropdownValue,
items: taxesGroups.map<DropdownMenuItem>((taxGroup) {
return DropdownMenuItem<String>(
value: taxGroup["name"],
child: Text(taxGroup["name"]),
);
}).toList(),
onChanged: (taxGroup) {
setState(() {
dropdownValue = taxGroup;
});
},
),