带有未来构建器的 Flutter 下拉列表答案

【问题标题】：Flutter dropdown with future builder带有未来构建器的 Flutter 下拉列表
【发布时间】：2023-01-25 17:33:02
【问题描述】：

这是我的数据模型

class RoleModel {
  int? id;
  String? role;

  RoleModel({this.id, this.role});
  RoleModel.fromJson(Map<String, dynamic> json) {
    id = json['id'];
    role = json['role'];
  }
  Map<String, dynamic> toJson() {
    final Map<String, dynamic> data = <String, dynamic>{};
    data['id'] = id;
    data['role'] = role;
    return data;
  }
}

这是我获取api数据的代码

List<RoleModel> roles = [];

  Future<List<RoleModel>> getRoles() async {
    try {
      final response = await http
          .get(Uri.parse('https://localhost:8000/roles'));
      var data = jsonDecode(response.body.toString());
      if (response.statusCode == 200) {
        for (Map<String, dynamic> i in data) {
          roles.add(RoleModel.fromJson(i));
        }
        return roles;
      } else {
        throw Exception('Failed to load roles:$response');
      }
    } catch (e) {
      throw Exception('Failed due to: $e');
    }
  }

我怎样才能创建一个下拉按钮，它将“id”作为值，“role”将显示为文本？

【问题讨论】：

标签： flutter dart flutter-futurebuilder

【解决方案1】：

你可以这样创建

 DropdownButton<int>(
          items: [
            DropdownMenuItem(
              child: Text("${roleModel.role}"),
              value: roleModel.id,
            ),
          ],
          onChanged: (value) {},
        ),

【讨论】：