Flutter使用Dio请求接口报List<dynamic>不是Map<String,dynamic>子类型如何解决

错误原因 #

你调用的接口返回值是List<dynamic>类型的用户数组，而非单个Map<String, dynamic>结构的用户对象，直接将列表传入Users.fromJson方法才会触发类型不匹配报错。

需修改的代码部分 #

1. 调整DioClient请求方法 #

将原返回单个用户对象的逻辑改为返回用户列表，直接遍历接口返回的列表逐个解析：

class DioClient {
  final Dio _dio = Dio();
  final _farmerUrl = 'https://retoolapi.dev/Rzl99e/farmers';
  // 调整返回值类型为用户列表
  Future<List<Users>> getUser() async {
    List<Users> users = [];
    try {
      Response userData = await _dio.get(_farmerUrl);
      print('User Info: ${userData.data}');
      // 遍历返回的列表解析为Users对象
      users = (userData.data as List).map((item) => Users.fromJson(item)).toList();
    } on DioError catch (e) {
      if (e.response != null) {
        print('Dio error!');
      } else {
        print('Error sending request! '+ e.message);
      }
    }
    return users;
  }  
}

2. 调整列表页面渲染逻辑 #

修改FutureBuilder的泛型类型，将解析完成的用户列表遍历生成对应的ListTile组件，同时替换强制解包语法避免空值崩溃：

body: SingleChildScrollView(
  child: Center(
    child: FutureBuilder<List<Users>>(
      future: _client.getUser(),
      builder: (context, snapshot) {
        if (snapshot.connectionState == ConnectionState.done) {
          if (snapshot.hasData && snapshot.data!.isNotEmpty) {
            return Column(
              children: snapshot.data!.map((userInfo) {
                return ListTile(
                  title: Text('${userInfo.firstName ?? ''} ${userInfo.lastName ?? ''}'),
                  subtitle: Text(userInfo.phoneNumber ?? ''),
                );
              }).toList(),
            );
          }
          return const Text('暂无可用用户数据');
        }
        return const CircularProgressIndicator();
      },
    ),
  ),
),

如果列表数据量较大，也可以将Column替换为ListView.builder实现懒加载，优化列表滚动性能。

内容的提问来源于stack exchange，提问作者Kevnlan