Flutter 相关下拉错误“检测到具有相同值的零个或 2 个或更多 [DropdownMenuItem]”答案

【问题标题】：Flutter Dependent Dropdown Error "Either zero or 2 or more [DropdownMenuItem]s were detected with the same value"Flutter 相关下拉错误“检测到具有相同值的零个或 2 个或更多 [DropdownMenuItem]”
【发布时间】：2023-02-16 13:12:57
【问题描述】：

再会。我遇到一个问题，其中出现错误 Either zero or 2 or more [DropdownMenuItem]s were detected with the same value 选择回父下拉列表的默认值时。

例如： "Product" is the default value in dropdown and click both "Meal" and "Health" by swapping. I'll select now the "Services" and select both "Massage" and "Delivery" by swapping. Now, will go to "Product" then the error will be visible.

这些是我使用的变量。

String? getStringType;
String? getStringCategory;
List<dynamic> dropDownItemType = [];
List<dynamic> categoryMasters = [];
List<dynamic> categories = [];
String? itemTypeId;
String? categoryId;

这是我的 initState，其中存储了列表值。

void initState() {
    // TODO: implement initState
    dropDownItemType.add({"id": 1, "name": "Product"});
    dropDownItemType.add({"id": 2, "name": "Services"});

    categoryMasters = [
      {
        "ID": 1,
        "Name": "Meal",
        "ParentId": 1,
      },
      {
        "ID": 2,
        "Name": "Health",
        "ParentId": 1,
      },
      {
        "ID": 3,
        "Name": "Massage",
        "ParentId": 2,
      },
      {
        "ID": 4,
        "Name": "Delivery",
        "ParentId": 2,
      },
    ];
    super.initState();
  }

这是我的父下拉列表，其中子下拉列表取决于要选择的值。

FormHelper.dropDownWidget(
                                context,
                                "Select Type",
                                this.itemTypeId,
                                this.dropDownItemType,
                                (onChangedVal) {
                                  itemTypeId = onChangedVal;
                                  getStringType = dropDownItemType[
                                          int.parse(itemTypeId.toString()) - 1]
                                      ["name"];

                                  print(
                                      "ge: ${itemTypeId} and ${getStringType}");
                                  this.categories = this
                                      .categoryMasters
                                      .where((categoryItem) =>
                                          categoryItem["ParentId"].toString() ==
                                          onChangedVal.toString())
                                      .toList();
                                  setState(() {
                                    this.categoryId = null;
                                  });
                                },
                                (onValidateVal) {
                                  if (onValidateVal == null) {
                                    return 'Select a Type';
                                  }
                                  return null;
                                },
                                borderFocusColor: const Color(0xFFCECECE),
                                prefixIconColor: const Color(0xFF808080),
                                borderColor: const Color(0xFFCECECE),
                                enabledBorderWidth: 1,
                                prefixIconPaddingLeft: 12,
                                borderRadius: 12,
                                paddingLeft: 0,
                                hintFontSize: 12,
                                paddingRight: 0,
                                contentPadding: 14,
                                showPrefixIcon: true,
                                borderWidth: 1,
                                prefixIcon: const Icon(Icons.type_specimen),
                              ),

这是子下拉菜单，它取决于父下拉菜单的值。

FormHelper.dropDownWidget(
                              context,
                              "Select Category",
                              this.categoryId,
                              this.categories,
                              (onChangedVal) {
                                this.categoryId = onChangedVal;
                                setState(() {
                                  this.categoryId = this
                                      .categoryMasters[0]["ParentId"]
                                      .toString();
                                });
                                getStringCategory = this.categoryMasters[
                                        int.parse(categoryId.toString()) - 1]
                                    ["Name"];
                                print("Cat Name: ${getStringCategory}");
                                
                              },
                              (onValidateVal) {
                                return null;
                              },
                              borderFocusColor: const Color(0xFFCECECE),
                              prefixIconColor: const Color(0xFF808080),
                              borderColor: const Color(0xFFCECECE),
                              enabledBorderWidth: 1,
                              prefixIconPaddingLeft: 12,
                              hintFontSize: 12,
                              borderRadius: 12,
                              paddingLeft: 0,
                              paddingRight: 0,
                              contentPadding: 14,
                              showPrefixIcon: true,
                              borderWidth: 1,
                              prefixIcon: const Icon(Icons.type_specimen),
                              
                            ),

【问题讨论】：

标签： flutter dart dropdown

【解决方案1】：

在这里，我有下拉列表的参考，请参考：

class _EmptySearchState extends State<EmptySearch> {
  String? value1 = "";

  List<String> nameList = [
    "Name1",
    "Name2",
    "Name3",
    "Name4",
    "Name5",
    "Name6",
    "Name7",
    "Name8"
  ];

  @override
  void initState() {
    super.initState();
    value1 = nameList[0];
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        elevation: 2.0,
        title: const Text('Hello'),
      ),
      body: DropdownButton(
        value: value1,
        onChanged: (value) {
          setState(() {
            value1 = value.toString();
          });
        },
        items: nameList.map(
          (item) {
            return DropdownMenuItem(
              value: item,
              child: Text(item),
            );
          },
        ).toList(),
      ),
      backgroundColor: Colors.grey[200],
    );
  }
}

【讨论】：