0

我创建了以下自定义下拉小部件。

class CustomDropdown extends StatefulWidget {
  final Color? textColor;
  final Color? backgroundColor;
  final Color? iconColor;
  final bool? boldText;
  final Object? initialValue;
  final List<DropdownMenuItem<Object?>> itemList;
  final Function(Object?) onItemSelect;

  const CustomDropdown({
    Key? key,
    this.textColor,
    this.backgroundColor,
    this.boldText,
    this.iconColor,
    required this.initialValue,
    required this.itemList,
    required this.onItemSelect,
  }) : super(key: key);

  @override
  _CustomDropdownState createState() => _CustomDropdownState();
}

class _CustomDropdownState extends State<CustomDropdown> {
  late Object? _dropdownValue;
  late bool _boldText;

  @override
  void initState() {
    super.initState();
    _dropdownValue = widget.initialValue;
    _boldText = widget.boldText ?? false;
  }

  @override
  Widget build(BuildContext context) {
    return SizedBox(
      height: 20,
      child: DropdownButtonHideUnderline(
        child: DropdownButton<Object?>(
          value: _dropdownValue,
          icon: Icon(
            Icons.expand_more_outlined,
            color: widget.iconColor ?? (widget.textColor ?? Colors.black),
          ),
          dropdownColor: widget.backgroundColor ?? Colors.white,
          style: TextStyle(
            color: widget.textColor ?? Colors.black,
            fontWeight: _boldText ? FontWeight.bold : FontWeight.normal,
          ),
          items: widget.itemList,
          onChanged: (value) {
            setState(() => _dropdownValue = value);
            widget.onItemSelect(value);
          },
        ),
      ),
    );
  }
}

然后我在一个单独的 dart 文件中实例化上面创建的小部件，如下所示，

class CurrencyDropdown extends StatelessWidget {
  const CurrencyDropdown({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Center(
      child: CustomDropdown(
        initialValue: Currency(id: 1, displayText: 'USD'),     <------------ This line throws an error
        boldText: true,
        iconColor: ColorData.disabledTextColor,
        itemList: [
          DropdownMenuItem(
            child: Text('USD'),
            value: Currency(id: 1, displayText: 'USD'),
          ),
          DropdownMenuItem(
            child: Text('LKR'),
            value: Currency(id: 2, displayText: 'LKR'),
          ),
        ],
        onItemSelect: (_) {},
      ),
    );
  }
}

在上面的代码中，如果我用箭头替换我所指向的值，null一切正常。但是，如果我提供上述代码片段中显示的值，则会引发错误。

错误文本说的是，

应该只有一项具有 [DropdownButton] 的值：{ id: 1, displayText: USD }。检测到 0 个或 2 个或多个 [DropdownMenuItem] 具有相同的值 'package:flutter/src/material/dropdown.dart'

此外，它还显示了以下代码片段，Failed assertion: line 915 pos 15：

'items == null || items.isEmpty || value == null ||
              items.where((DropdownMenuItem<T> item) {
                return item.value == value;
              }).length == 1'

我也遇到了下面的堆栈溢出帖子，但找不到解决方案，

有人可以帮帮我吗？我真的很感激！

4

1 回答 1

1

您initialValue与 中的任何值都不匹配itemList，请尝试以下代码：

class CurrencyDropdown extends StatelessWidget {
  CurrencyDropdown({Key? key}) : super(key: key);

  List<Currency> list = [
    Currency(id: 1, displayText: 'USD'),
    Currency(id: 2, displayText: 'LKR'),
  ];

  @override
  Widget build(BuildContext context) {
    return Center(
      child: CustomDropdown(
        initialValue: list[0],
        boldText: true,
        iconColor: Colors.grey,
        itemList: list
            .map(
              (e) => DropdownMenuItem(
                child: Text(e.displayText),
                value: e,
              ),
            )
            .toList(),
        onItemSelect: (_) {},
      ),
    );
  }
}
于 2021-12-13T07:36:23.320 回答