Flutter：应该只有一项具有 [DropdownButton] 的值

Question

我正在尝试在 Flutter 中创建一个下拉按钮。我从我的数据库中获得一个列表，然后我将列表传递给我的dropdownButton一切正常数据按预期显示，但当我从它我得到这个错误：

There should be exactly one item with [DropdownButton]'s value: Instance of 'Tag'. 
Either zero or 2 or more [DropdownMenuItem]s were detected with the same value
'package:flutter/src/material/dropdown.dart':
Failed assertion: line 805 pos 15: 'items == null || items.isEmpty || value == null ||
          items.where((DropdownMenuItem<T> item) {
            return item.value == value;
          }).length == 1'

我尝试将 DropdownButton 值设置为 null 它可以工作，但是我看不到所选元素。

这是我的代码：

FutureBuilder<List<Tag>>(
    future: _tagDatabaseHelper.getTagList(),
    builder: (BuildContext context, AsyncSnapshot<List<Tag>> snapshot) {
      if (!snapshot.hasData) {
        return Center(
          child: CircularProgressIndicator(),
        );
      }
      return ListView(
        children: <Widget>[
          SizedBox(
            height: MediaQuery.of(context).size.height * 0.2,
          ),
          Container(
            margin: EdgeInsets.symmetric(
                horizontal: MediaQuery.of(context).size.width * 0.07),
            child: Theme(
              data: ThemeData(canvasColor: Color(0xFF525A71)),
              child: DropdownButton<Tag>(
                value: _selectedTag,
                isExpanded: true,
                icon: Icon(
                  Icons.arrow_drop_down,
                  size: 24,
                ),
                hint: Text(
                  "Select tags",
                  style: TextStyle(color: Color(0xFF9F9F9F)),
                ),
                onChanged: (value) {
                  setState(() {
                    _selectedTag = value;
                  });
                },
                items: snapshot.data.map((Tag tag) {
                  return DropdownMenuItem<Tag>(
                    value: tag,
                    child: Text(
                      tag.tagTitle,
                      style: TextStyle(color: Colors.white),
                    ),
                  );
                }).toList(),
                value: _selectedTag,
              ),
            ),
          ),

我使用 futureBuilder 来从数据库中获取我的列表。

Answer 1

好吧，因为没有问题有完全相同的解决方案。我的代码也面临同样的问题。这是我解决此问题的方法。

我的 DropdownButton 的代码：

DropdownButton(
   items: _salutations
         .map((String item) =>
             DropdownMenuItem<String>(child: Text(item), value: item))
         .toList(),
    onChanged: (String value) {
       setState(() {
         print("previous ${this._salutation}");
         print("selected $value");
         this._salutation = value;
            });
          },
     value: _salutation,
),

错误

在下面的代码 sn-p 中，我设置了一个选择值的状态，它是 String 类型的。现在我的代码的问题是这个选择值的默认初始化。 最初，我将变量 _salutation 初始化为：

String _salutation = ""; //Notice the empty String.

这是一个错误！

初始选择不应为空或为空，如正确提及的错误消息。

'项目 == null ||项目.isEmpty ||值 == 空值 ||

因此崩溃：

解决方案
用一些默认值初始化值对象。 请注意，值应该是您的集合中包含的值之一。如果不是，那么预计会发生崩溃。

  String _salutation = "Mr."; //This is the selection value. It is also present in my array.
  final _salutations = ["Mr.", "Mrs.", "Master", "Mistress"];//This is the array for dropdown

Answer 2

如果尝试使用类实例设置下拉列表的值，也可能会出现此错误；

  var tag1 = Tag();
  var tag2 = Tag();
  print(tag1 == tag2); // prints false, dropwdown computes that value is not present among dropdown options

解决这个覆盖操作符==：

class Tag{
 String name = "tag";

  @override
  bool operator ==(Object other) => other is Tag && other.name == name;

  @override
  int get hashCode => name.hashCode;
}

或使用https://pub.dev/packages/equatable lib

class Tag extends Equatable{
 String name = "tag";

  @override
  List<Object> get props => [name];
}

Answer 3

我遇到了同样的问题。解决方案很简单：您必须确保作为默认下拉值的字符串包含在您要在下拉菜单中使用的列表中。如果您想使用 api 中的列表，您应该确保知道该列表的至少一个值，以便您可以将其分配给作为默认下拉值的变量。

在这里，我想显示一个从 api 获得的列表。为了不出现错误，我将我的 defaultdropdownvalue 设置为名称“Encajes”，这是我的列表包含的现有类别之一。

String dropdownValue = "Encajes";

---

    items: categoriesString
    .map<DropdownMenuItem<String>>((String value) {
  return DropdownMenuItem<String>(
    value: value,
    child: Text(value),
  );
}).toList(),

Answer 4

我的下拉菜单代码

child: DropdownButton(
      items: _currencies.map((String value) {
        return DropdownMenuItem<String>(
          child: Text(value),
          value: value,
        );
      }).toList(),
      value: 'Rupees',
      onChanged: (String newValueSelected) {
        // Your code to execute, when a menu item is selected from 
        dropdown
      },
))
var _currencies = ['Rupee','Dollar','Pound'];

我遇到了同样的错误，因为下拉代码块中的值与 _currencies 中的任何字段都不匹配

Answer 5

所以我找到了一个解决方案。

我创建了空列表来保存我的标记对象。

List<Tag> _tagList = [];

然后，在我的 initState 中，我分配 我从数据库获得的列表 到 previous List

 @override
void initState() {
super.initState();
_tagDatabaseHelper.getTagList().then((foo) {
  setState(() {
    _tagList = foo;
  });
});

}

最后是我的 DropdownButton 代码：

DropdownButton<Tag>(
            isExpanded: true,
            icon: Icon(
              Icons.arrow_drop_down,
              size: 24,
            ),
            hint: Text(
              "Select tags",
              style: TextStyle(color: Color(0xFF9F9F9F)),
            ),
            items: _tagList.map((foo) {
              return DropdownMenuItem(
                value: foo,
                child: Text(foo.tagTitle),
              );
            }).toList(),
            onChanged: (value) {
              setState(() {
                _selectedTag = value;
              });
            },
            value: _selectedTag,
          ),

Answer 6

只需让标签类从Equatable 扩展并将属性传递给道具。这对我来说是诀窍。

class Tag extends Equatable{
  String id;
  String name;

  Tag(this.id, this.name);

  @override
  List<Object> get props => [id,name];

}

Answer 7

我遇到了同样的问题，令人惊讶的是，我的项目列表中有重复项，这些项目是从远程数据库中获取的。

每次我从服务器获取数据时（当一个新的应用用户登录时），数据没有重复，但相同的数据被多次添加到列表中，因为我在同一设备上登录了多个用户.也许你的错误是类似的。

因此，请确保在 snapshot.data 中删除所有重复项，然后再将它们设置为 DropDownButton 的项目。。 p>

Answer 8

我有同样的错误，我的默认值不在 listItems 中，在下拉按钮中映射为：

String defaultvalue = 'selectCategorie'

const List<String> Subcategories = ['category 1','category 2','category 3'...];

不得不改成这样：-

String defaultvalue = 'selectCategorie';

const List<String> Subcategories = ['selectCategorie','category 1','category 2','category 3'...];

现在当您在 DropdownButton 中传递 defaultvalue 时不会出现错误

DropdownButton (
  item:[]
 onChanged: (String values){
   print(values);
setState(() {
defaultValue = values;
});
},
value: defaultValue,
)

Answer 9

您可以使用三元运算符避免空值：

  Container(
             child:
              new DropdownButton<String>(
              value: dropdownValue ?? "1",
              icon: const Icon(Icons.arrow_downward),
              iconSize: 24,
              elevation: 16,
              style: const TextStyle(color: Colors.black, fontSize: 18),
              underline: Container(height: 2, color: Colors.white24, ),
              items: <String>['1', '2', '3', '5'].map((String value) {
              return new DropdownMenuItem<String>(
              value: value,
              child: new Text(value),
              );}).toList(),
              onChanged: (value) {
                  setState(() { dropdownValue=value;});
              },
          )),

Answer 10

我使用了一个技巧。所选项目作为列表中的第一个索引项目。因此，每次更改项目时从列表中删除项目并重新插入项目作为第一个项目列表 。请参考以下代码。在这里，我使用 Object 作为下拉项，而我将其作为提取函数的小部件。以及在调用 dropDownButton 函数之前制作

//物品清单如下

 List<LeaveType> items = [
 (id=1,name="Sick"),
 (id=2,name="Paid")
 ]

selectedLeave = null;

Row leaveTypeDropDown(StateSetter setCustomState, List<LeaveType> items) {
    if(selectedLeave != null){
      items.remove(selectedLeave);
      items.insert(0, selectedLeave);
    }
    return Row(
            mainAxisAlignment: MainAxisAlignment.spaceEvenly,
            children : [
              text("Select Leave Type",textSize: 15),
              Padding(padding: const EdgeInsets.all(5)),
              Expanded(
                child: Container(
                  padding: const EdgeInsets.only(left: 10.0, right: 10.0),
                  decoration: BoxDecoration(
                    border: Border.all(color: Colors.black,width: 1),
                    borderRadius: const BorderRadius.all(Radius.circular(10.0)),
                  ),
                  child: DropdownButtonHideUnderline(
                    child: DropdownButton<LeaveType>(
                      isExpanded: true,
                      //initial value 
                      value: selectedLeave != null ? items[0] : null,
                      icon: const Icon(Icons.arrow_downward),
                      iconSize: 24,
                      elevation: 16,
                      hint: text("Leave Type"),
                      style: const TextStyle(
                          color: Colors.black
                      ),
                      onChanged: (LeaveType  value) {
                        setCustomState(() {
                          selectedLeave = value;
                          items.remove(selectedLeave);
                          items.insert(0, selectedLeave);
                        });
                      },
                      items: items
                          .map((leave) {
                        return  new DropdownMenuItem<LeaveType>(
                          value: leave,
                          child: text(leave.name),
                        );
                      }).toList(),
                    ),
                  ),
                ),
              ),
            ]
        );
  }

Answer 11

我修改如下，它得到了解决：

初始代码：

List<GamesModel> users = <GamesModel>[
  new GamesModel(1,"Option1"),
  new GamesModel(2,"Option2"),

];
return users;

更改代码：

List<GamesModel> users = <GamesModel>[
      const GamesModel(1,"Option1"),
      const GamesModel(2,"Option2"),
];
return users;

如果有人想要我可以把整个代码放上去

Answer 12

如果您忘记为下拉菜单项赋值，也会发生此错误。 ==== 工作 ====

<String>['A', 'B', 'C'].map<DropdownMenuItem<String>>((vehicle) {
        print("vehicle is $vehicle");
        print("vehicle is equal ${vehicle == x.value}");
        return DropdownMenuItem<String>(
          value: vehicle,
          child: Text(
            // vehicle.vehicleInfo!.vehicleType!,
            vehicle,
            style: TextStyle(
              color: Colors.grey[600],
            ),
          ),
        );
      }).toList(),

==== 不起作用 ====

<String>['A', 'B', 'C'].map<DropdownMenuItem<String>>((vehicle) {
        return DropdownMenuItem<String>(
          child: Text(
            vehicle,
            style: TextStyle(
              color: Colors.grey[600],
            ),
          ),
        );
      }).toList(),

Answer 13

          DropdownButton<String>(
            iconEnabledColor: Colors.cyan.withOpacity(.6),
            isExpanded: true,
            itemHeight: 50,
            iconSize: 30,
            hint: Text("Choose Province"),
            items: _provinces
                .map((e) => DropdownMenuItem(
              child: Text(e),
              value: e,
            ))
                .toList(),
            value: _Province,
            onChanged: (String? value) async{
              final respnose=await FirebaseFirestore.instance.collection('city').where('provinceName',isEqualTo: value).get();
              _city=[];
              for(var item in respnose.docs){
                print(item.data());
                _city.add(item.data()['name']);
              }
              
              print(_Province);
              setState(() {
                _city=_city;
                _Province = value;
              });
            },
          ),
          SizedBox(height: 20,),

          DropdownButton<String>(
            iconEnabledColor: Colors.cyan.withOpacity(.6),
            isExpanded: true,
            itemHeight: 50,
            iconSize: 30,
            hint: Text("Choose City"),
            items:_city
                .map((e) => DropdownMenuItem(
              child: Text(e),
              value: e,
            ))
                .toList(),
            value: _City,
            onChanged: (String? value) async{
              setState(() {
                _town=[];
                _Town=null;
              });
              print(_town);
              final respnose=await FirebaseFirestore.instance.collection('town').where('cityName',isEqualTo: value).get();
              print(respnose.docs);


              for(var item in respnose.docs){
                print(item.data());
                _town.add(item.data()['name']);
              }
              print(_town);
              print(_City);
              setState(() {

                _City = value;
                _town=_town;
              });
            },
          ),
          SizedBox(height: 20,),
          
          if(true)
          DropdownButton<String>(
            iconEnabledColor: Colors.cyan.withOpacity(.6),
            isExpanded: true,
            itemHeight: 50,
            iconSize: 30,
            hint: Text("Choose Town"),
            items:_town
                .map((e) => DropdownMenuItem(
              child: Text(e),
              value: e,
            )
            )
                .toList(),
            value: _Town,
            onChanged: (String? value)async {
              print(_Town);
              setState(() {
                _Town = value;
              });

         

Answer 14

我也遇到了同样的问题，解决办法是把DropdownButton的值填进去(value:(使用你设置的item中的值) 你不能使用任何你想要的值，但它应该是你为 DropdownMenuItem 设置的项目之一。