[英]In Flutter, I am trying to make a dependent dropdown with the following json
In Flutter, I am trying to make a dependent dropdown with the following json.在 Flutter 中,我正在尝试使用以下 json 创建依赖下拉列表。
I Want the Dropdown to be in this format我希望下拉菜单采用这种格式
First, Independent Dropdown一、独立下拉
dataNames数据名称
Second, Dependent Dropdown二、Dependent Dropdown
indexes of the dataSets' children数据集子项的索引
Third, Dependent Dropdown三、Dependent Dropdown
select the children of the above drop-down (...hello 1, hello 2... ) select 上面下拉的子项(...你好1,你好2...)
[
{
"dataName": "data1",
"dataSets": [
["hello 1", "hello 2", "hello 3"],
["hi 1", "hi 2", "hi 3", "hi 4"]
]
},
{
"dataName": "data2",
"dataSets": [
["2nd 1", "2nd 2", "2nd 3"],
["let 1", "let 2", "let 3", "let 4"]
]
}
]
Here is the first step: parsing the json into a class model and then creating a list of models.这是第一步:将 json 解析为 class model,然后创建模型列表。 second step build the DropdownMenuItem list to be consumed by the DropDownbutton.
第二步构建要由 DropDown 按钮使用的 DropdownMenuItem 列表。 Create a _currentResultClass variable the first dropdownbutton (level1) selection.
创建一个 _currentResultClass 变量第一个 dropdownbutton (level1) 选择。 Step 3: filter on level 1 dataName and find the model then populate dropdownmenuitems based on a filter by that dataname.
第 3 步:过滤级别 1 数据名并找到 model,然后根据该数据名的过滤器填充下拉菜单项。
class ResultClass
{
String?dataName;
//List<List<String>> dataSets= new List.generate(n, (i) => []);
List<List<String>>? dataSets= [];
ResultClass({this.dataName,this.dataSets});
ResultClass.fromJson(Map<String, dynamic> json) {
dataName = json['dataName'];
dataSets = json['dataSets'];
}
Map<String,dynamic> toJson(){
final Map<String,dynamic>data = new Map<String,dynamic>();
data['dataName']=this.dataName;
data['dataSet']=this.dataSets;
return data;
}
}
class TestDropDown extends StatefulWidget {
TestDropDown({Key? key}) : super(key: key);
@override
State<TestDropDown> createState() => _TestDropDownState();
}
class _TestDropDownState extends State<TestDropDown> {
ResultClass ? _currentResultClassLevel1;
String ? _currentStringLevel2;
List<ResultClass> lst=[];
List<DropdownMenuItem<ResultClass>>? itemsLevel1;
var data=[
{
"dataName": "data1",
"dataSets": [
["hello 1", "hello 2", "hello 3"],
["hi 1", "hi 2", "hi 3", "hi 4"]
]
},
{
"dataName": "data2",
"dataSets": [
["2nd 1", "2nd 2", "2nd 3"],
["let 1", "let 2", "let 3", "let 4"]
]
}
];
@override
void initState() {
// TODO: implement initState
super.initState();
for(var i=0; i<data.length; i++)
{
ResultClass model = ResultClass.fromJson(data[i]);
lst.add(model);
if (i==0)
{
_currentResultClassLevel1=model;
}
}
itemsLevel1 = lst
.map((item) => DropdownMenuItem<ResultClass>(
child: Text(item.dataName??""), value: item))
.toList();
}
@override
Widget build(BuildContext context) {
List<ResultClass> models = lst.where((item)=> item.dataName==_currentResultClassLevel1?.dataName).toList();
List<String> strings=[];
models.forEach((model)=>
model.dataSets?[0].forEach((element)=>strings.add(element)));
var itemsLevel2= strings.map((item) => DropdownMenuItem<String>(
child: Text(item), value: item))
.toList();
return Scaffold(appBar: AppBar(title: Text("Dropdown"),),body:
Column(children: [
DropdownButton<ResultClass>(items: itemsLevel1,
value: this._currentResultClassLevel1,
onChanged: (item){
setState(() {
_currentResultClassLevel1=item;
});
},),
DropdownButton<String>(items: itemsLevel2,
value: this._currentStringLevel2,
onChanged: (item){
setState((){
_currentStringLevel2=item;
});
},),
SizedBox(height:50)
],)
);
}
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.