时间戳

首页 > 解决方案 > Flutter 通过传递任何结构化数据制作 DropDown 小部件

flutter - Flutter 通过传递任何结构化数据制作 DropDown 小部件

问题描述

在这个新的中widget，我想DropDown通过传递任何结构化数据来创造新的东西，例如，这extendedClass是一个pairValue我想在这里传递的类。

这段代码不正确，我无法在那里正确传递

class CDropDown extends StatelessWidget {
  final List<T> dataClass;
  final T className;
  CDropDown({@required this.className, @required this.dataClass});

  @override
  Widget build(BuildContext context) {
    return DropdownButton<className>(
      value: dataClass[0],
      underline: Container(),
      isExpanded: true,
      icon: Icon(Icons.keyboard_arrow_down),
      items: dataClass.map((className user) {
        return  DropdownMenuItem<className>(
          value: user,
          child:  Text(
            user.name),
          );
      }).toList(),
      onChanged: null,
    );
  }
}

例如：

class User {
  const User(this.id,this.name);

  final String name;
  final int id;
}
List<User> users = <User>[const User(1,'Foo'), const User(2,'Bar')];
CDropDown(className:User, dataClass :users );

标签： flutterdart

解决方案

这是一个建议

class CDropDown<T> extends StatelessWidget {
  final List<T> dataClass;
  final Widget Function(T) itemBuilder;
  CDropDown({@required this.dataClass, @required this.itemBuilder});

  @override
  Widget build(BuildContext context) {
    return DropdownButton<T>(
      value: dataClass[0],
      underline: Container(),
      isExpanded: true,
      icon: Icon(Icons.keyboard_arrow_down),
      items: dataClass.map((T user) {
        return DropdownMenuItem<T>(
          value: user,
          child: itemBuilder(user),
        );
      }).toList(),
      onChanged: null,
    );
  }
}

我补充一下itemBuilder，原因是当我打电话user.name时CDropDown，它会显示The getter 'name' isn't defined for the type 'T'.。它应该像这样使用

class User {
  const User(this.id,this.name);

  final String name;
  final int id;
}
List<User> users = <User>[const User(1,'Foo'), const User(2,'Bar')];
CDropDown<User>(dataClass :users, itemBuilder:(user){return Text(user.name);} );

推荐阅读