颤振中的多重相关下拉

时间:2020-02-20 15:49:50

标签: flutter dart

我正在尝试在flutter上构建多个从属下拉列表。第二个依赖于第一个。这是我已实现的下拉菜单的代码。

Container(
            child: new DropdownButton<String>(
              underline: SizedBox(
                height: 1,
              ),
              hint: new Text("Select Faculty"),
              value: facultyId,
              items: faculty.map((item) {
                return new DropdownMenuItem(
                  child: new Text(item['name']),
                  value: item['id'].toString(),
                );
              }).toList(),
              onChanged: (faculty == null)
                  ? null
                  : (String newValue) {
                      setState(() {
                        filteredbatch.clear();
                        facultyId = newValue;
                        for (var item in allbatch) {
                          if (item['facultyId'].toString() == newValue){
                          filteredbatch.add(item);
                            disableBatch = false;
                          }
                        }
                      });
                      print(facultyId);
                    },
            ),
          ),
          Container(
            child: new DropdownButton<String>(
                underline: SizedBox(
                  height: 1,
                ),
                disabledHint: new Text("Select Faculty First"),
                hint: Text("Select Batch"),
                value: batchId,
                onChanged: disableBatch
                    ? null
                    : (String newValue) {
                        setState(() {
                          batchId = newValue;
                          disableSection = false;
                        });
                        print(batchId);
                      },
                items: filteredbatch.map((item) {
                  return DropdownMenuItem(
                    child: Text(item['name']),
                    value: item['id'].toString(),
                  );
                }).toList()),
          ),

每当我从第一个下拉菜单中选择一个下拉菜单项时,它将启用第二个下拉菜单,并允许我从该下拉菜单中选择一个项目。当我从第二个下拉菜单中选择一个项目并返回以更改第一个下拉菜单时,它会引发错误,要求下拉菜单需要一个具有相应值的项目。找到0或2。我在这里迷路了。如何解决此错误?

1 个答案:

答案 0 :(得分:1)

这里发生的事情很简单。假设“ allbatch”具有以下值:

教职员工:foo,其批处理对象为:foo1,foo2,foo3

教职员工:bar,其批号为:bar1,bar2,bar3。

在第一个下拉列表中选择foo时,将创建一个新的“ filteredbatch”,并且其中仅包含foo1,foo2,foo3。然后,在第二个下拉列表中选择foo3,一切仍然可以正常工作...

但是,当您将第一个下拉菜单更改为bar时,“ filteredbatch”仅包含:bar1,bar2,bar3,而第二个下拉菜单值仍设置为foo3,在新生成的“ filteredbatch”中找不到该值,然后您会看到该错误。

要解决此问题,只需在第一个下拉onChanged方法中更改“ filteredbatch”之前,将batchId设置为null:

  setState(() {
    //fix
    batchId = null;
    //end of fix
    filteredbatch.clear();
    facultyId = newValue;
    for (var item in allbatch) {
      if (item['facultyId'].toString() == newValue){
      filteredbatch.add(item);
        disableBatch = false;
      }
    }
  });

您的第二个下拉列表将还原为提示文本,应用程序用户将不得不选择一个新的batchId。

如果您还有其他问题,请随时提出。