Either zero or 2 or more [DropdownMenuItem]s of DropDownButton2 widget were detected with the same value

Question

I am using DropDownButtonHideUnderline widget And I manage the state of this widget with getx I think the problem is because of the value property value of the DropdownButton2 widget Can anyone help me?

And the widget code is like so:

DropdownButtonHideUnderline(
                      child: Obx(
                        () => DropdownButton2(
                          isExpanded: true,
                          hint: Row(
                            children: const [
                              Icon(
                                Icons.list,
                                size: 16,
                                color: Colors.yellow,
                              ),
                              SizedBox(
                                width: 4,
                              ),
                              Expanded(
                                child: Text(
                                  'Add to',
                                  style: TextStyle(
                                    fontSize: 14,
                                    fontWeight: FontWeight.bold,
                                    color: Colors.yellow,
                                  ),
                                  overflow: TextOverflow.ellipsis,
                                ),
                              ),
                            ],
                          ),
                          //customItemsIndexes: [homeCtrl.tasks.length],
                          items: homeCtrl.tasks.map(
                            (element) {
                              final color = HexColor(element.color);
                              return DropdownMenuItem<TaskTest>(
                                value: element,
                                child: Row(
                                  mainAxisAlignment:
                                      MainAxisAlignment.spaceBetween,
                                  children: [
                                    Row(
                                      children: [
                                        Icon(
                                          IconData(element.icon,
                                              fontFamily: 'MaterialIcons'),
                                          color: color,
                                        ),
                                        SizedBox(
                                          width: 10,
                                        ),
                                        Text(
                                          element.title,
                                          overflow: TextOverflow.ellipsis,
                                        ),
                                      ],
                                    ),
                                    if (homeCtrl.selectedValue.value == element)
                                      FaIcon(FontAwesomeIcons.circleCheck,
                                          color: customColor.kBlue),
                                  ],
                                ),
                              );
                            },
                          ).toList(),
                           value: homeCtrl.selectedValue.value,
                          //value: homeCtrl.value,
                          onChanged: (value) =>
                              homeCtrl.setDropDownValue(value as TaskTest),
                          icon: const Icon(
                            Icons.arrow_forward_ios_outlined,
                          ),
                          iconSize: 14,
                          iconEnabledColor: Colors.yellow,
                          iconDisabledColor: Colors.grey,
                          buttonHeight: 35,
                          buttonWidth: double.infinity,
                          buttonPadding:
                              const EdgeInsets.only(left: 14, right: 14),
                          buttonDecoration: BoxDecoration(
                            gradient: kPinkGradient,
                            borderRadius: BorderRadius.circular(14),
                            border: Border.all(
                              color: Colors.black26,
                            ),
                            color: Colors.deepPurpleAccent,
                          ),
                          buttonElevation: 2,
                          itemHeight: 30,
                          itemPadding:
                              const EdgeInsets.only(left: 14, right: 14),
                          dropdownMaxHeight: 200,
                          dropdownWidth: 200,
                          dropdownPadding: null,
                          dropdownDecoration: BoxDecoration(
                            gradient: kPinkGradient,
                            borderRadius: BorderRadius.circular(14),
                            color: Colors.deepPurpleAccent,
                          ),
                          dropdownElevation: 8,
                          scrollbarRadius: const Radius.circular(40),
                          scrollbarThickness: 6,
                          scrollbarAlwaysShow: true,
                          offset: const Offset(-20, 0),
                        ),
                      ),
                    ),

The variable I defined in HomeController, which HomeController is actually the class that handles the state of the dropdown, which I extended with the getxController class.

final selectedValue = Rx<TaskTest?>(null);

This is the method to change the item in the drop down that I defined in the HomeController

void setDropDownValue(TaskTest? newValue) {
    selectedValue.value = newValue;
  }

An error that happened

======== Exception caught by widgets library =======================================================
The following assertion was thrown building Obx(has builder, dirty, state: _ObxState#78790):
There should be exactly one item with [DropdownButton]'s value: TaskTest(health, 59737, #FFfa63c6). 
Either zero or 2 or more [DropdownMenuItem]s were detected with the same value
'package:dropdown_button2/dropdown_button2.dart':
Failed assertion: line 968 pos 11: 'items == null ||
              items.isEmpty ||
              value == null ||
              items.where((DropdownMenuItem<T> item) {
                    return item.value == value;
                  }).length ==
                  1'

The relevant error-causing widget was: 
  Obx Obx:file:///E:/flutter-projects-licotab/bootcamp/task_managment_test/lib/widgets/task_sheet.dart:494:30
When the exception was thrown, this was the stack: 
#2      new DropdownButton2 (package:dropdown_button2/dropdown_button2.dart:968:11)

Answer 1

I think you should use keys for your DropDownButtons