出现“List<dynamic>”类型的错误不是“Map<String, dynamic>”类型的子类型

Posted 2023-02-23

【中文标题】出现“List<dynamic>”类型的错误不是“Map<String, dynamic>”类型的子类型

【英文标题】：Getting error of type 'List<dynamic>' is not a subtype of type 'Map<String, dynamic>'

【发布时间】：2021-12-01 15:29:40

【问题描述】：

我正在创建一个颤振应用程序以在列表中显示用户。我可以获取并打印数据，但是我无法显示数据，因为我收到此错误Exception has occurred. _TypeError (type 'List<dynamic>' is not a subtype of type 'Map<String, dynamic>')

我使用 dio 包来获取数据。这是用于进行 api 调用的代码

class DioClient 
  final Dio _dio = Dio();

  final _farmerUrl = 'https://retoolapi.dev/Rzl99e/farmers';

  Future<Users?> getUser() async 
    Users? users;
    try 
      Response userData = await _dio.get(_farmerUrl);
      print('User Info: $userData.data');
      users = Users.fromJson(userData.data);
     on DioError catch (e) 
      if (e.response != null) 
        print('Dio error!');
       else 
        print('Error sending request! '+ e.message);
      
    
    return users;
    

这是我用来解析json响应的模型类

List<Users> usersFromJson(String str) => List<Users>.from(json.decode(str).map((x) => Users.fromJson(x)));

String usersToJson(List<Users> data) => json.encode(List<dynamic>.from(data.map((x) => x.toJson())));

class Users 
    Users(
        this.id,
        this.bio,
        this.email,
        this.lastName,
        this.firstName,
        this.phoneNumber,
        this.memberNumber,
    );

    int? id;
    String? bio;
    String? email;
    String? lastName;
    String? firstName;
    String? phoneNumber;
    String? memberNumber;

    factory Users.fromJson(Map<String, dynamic> json) => Users(
        id: json["id"],
        bio: json["bio"],
        email: json["email"],
        lastName: json["last_name"],
        firstName: json["first_name"],
        phoneNumber: json["phone_number"],
        memberNumber: json["member_number"],
    );

    Map<String, dynamic> toJson() => 
        "id": id,
        "bio": bio,
        "email": email,
        "last_name": lastName,
        "first_name": firstName,
        "phone_number": phoneNumber,
        "member_number": memberNumber,
    ;

这是我用来显示用户列表的代码

      body: SingleChildScrollView(
        child: Center(
          child: FutureBuilder<Users?>(
            future: _client.getUser(),
            builder: (context, snapshot) 
              if (snapshot.hasData) 
                Users? userInfo = snapshot.data;
                if (userInfo != null) 
                  return ListTile(
                    title: Text(userInfo.firstName! + ' ' + userInfo.lastName!),
                    subtitle: Text(userInfo.phoneNumber!),
                  );
                
              
              return CircularProgressIndicator();
            ,
          ),
        ),
      ),

我可以更改什么以完全显示用户列表。

【参考方案1】：

解码您的数据并将其以列表格式存储，因为您的 API 返回列表数据

return UserRes.fromJsonMap(jsonDecode(userData.data));

为用户列表创建响应类

class UserRes
  List<Users> content;

  UserRes.fromJsonMap(dynamic data)
      : content = List<Users>.from(
      data.map((sat) => Users.fromJson(sat)));

然后调用 API，你的未来将返回列表响应：

 final _farmerUrl = 'https://retoolapi.dev/Rzl99e/farmers';

  Future<UserRes> getUser() async 
    try 
      Response userData = await _dio.get(_farmerUrl);
      print('User Info: $userData.data');
      return UserRes.fromJsonMap(jsonDecode(userData.data));
     on DioError catch (e) 
      if (e.response != null) 
        print('Dio error!');
       else 
        print('Error sending request! '+ e.message);
      
    
  

您可以从 UI 调用

body: SingleChildScrollView(
        child: Center(
          child: FutureBuilder<Users?>(
            future: _client.getUser(),
            builder: (context, snapshot) 
              if (snapshot.hasData) 
                List<Users>? userInfo = snapshot.data;
                if (userInfo != null) 
                  return ListTile( // your data is list format you can bind with listBuilder 
                    title: Text(userInfo.first.firstName! + ' ' + userInfo.first.lastName!),
                    subtitle: Text(userInfo.first.phoneNumber!),
                  );
                
              
              return CircularProgressIndicator();
            ,
          ),
        ),
      ),

【参考方案2】：

API 返回 JSON 数组而不是 json 对象，因此是 List 而不是 Map。

即用户 json 是 Json Array 的第一个元素。

所以要获取第一个元素，请使用第一个索引。内部获取信息更新

return Users.fromJson(jsonresponse[0]);