Flutter使用Obx从API获取数据时列表始终为空问题求助

核心问题1：UserModel的id类型不匹配 #

JSONPlaceholder返回的用户id是整数类型，但你的User类里将id定义为String，在fromJson直接赋值时会抛出类型转换错误，而你的fetchUsers方法中catch块没有打印错误信息，导致问题被隐藏。

修复后的UserModel：

class User {
  final String id;
  final String name;

  User({required this.id, required this.name});

  factory User.fromJson(Map<String, dynamic> json) {
    return User(
      // 将int类型的id转为String
      id: json['id'].toString(),
      name: json['name'],
    );
  }
}

核心问题2：GetView重复注入控制器 #

GetView<UserController>已经通过泛型自动帮你注入并获取了控制器实例，但你又手动调用Get.put(UserController())，这会导致页面中存在两个独立的控制器实例：

• 一个是GetView自带的实例（未触发onInit里的fetchUsers）
• 另一个是你手动注入的实例（执行了fetchUsers并更新了数据）
  而Obx监听的是GetView自带的那个空实例，所以始终显示加载状态。

修复后的UserView：

import 'package:flutter/material.dart';
import 'package:get/get.dart';
import '../controllers/user_controller.dart';

class UserView extends GetView<UserController> {
  UserView({Key? key}) : super(key: key);
  // 移除手动注入的控制器，直接使用GetView提供的controller属性

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('User List'),
      ),
      body: Obx(() {
        if (controller.users.isEmpty) {
          return const Center(child: CircularProgressIndicator());
        } else {
          return ListView.builder(
            itemCount: controller.users.length,
            itemBuilder: (context, index) {
              final user = controller.users[index];
              return ListTile(
                title: Text(user.name),
              );
            },
          );
        }
      }),
      floatingActionButton: FloatingActionButton(
        onPressed: () {
          controller.fetchUsers();
        },
        child: const Icon(Icons.refresh),
      ),
    );
  }
}

额外优化：添加错误日志 #

在fetchUsers的catch块中添加错误打印，方便后续排查问题：

Future<void> fetchUsers() async {
  try {
    final response = await http.get(Uri.parse('https://jsonplaceholder.typicode.com/users'));

    if (response.statusCode == 200) {
      final List<dynamic> jsonList = json.decode(response.body);
      users.value = jsonList.map((json) => User.fromJson(json)).toList();
    } else {
      print('请求失败，状态码：${response.statusCode}');
    }
  } catch (e) {
    print('请求出错：$e'); // 添加错误打印
  }
}

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