Flutter：如何从返回纯整数的GET接口取值并显示在Text组件中

1. 修改异步接口调用函数 #

因为接口返回的是纯整数文本（而非JSON格式），不需要使用json.decode()解析，直接读取response.body即可。你可以根据需求选择返回String或int类型：

返回String类型（直接用于Text显示） #

Future<String> getNumberIntervention() async {
  final response = await http.get(Uri.parse('my url'));
  if (response.statusCode == 200) {
    // 直接返回接口返回的纯文本内容，trim避免可能的空格或换行
    return response.body.trim();
  } else {
    throw Exception('Failed to load intervention number');
  }
}

返回int类型（适合后续数值运算） #

如果需要对该数值进行计算，可以转为整数类型：

Future<int> getNumberIntervention() async {
  final response = await http.get(Uri.parse('my url'));
  if (response.statusCode == 200) {
    try {
      // 尝试将文本转为整数
      return int.parse(response.body.trim());
    } catch (e) {
      throw Exception('Failed to parse response as integer');
    }
  } else {
    throw Exception('Failed to load intervention number');
  }
}

2. 在Text组件中显示数据 #

由于接口调用是异步操作，需要用FutureBuilder处理异步状态（加载中、加载成功、加载失败），将数据同步到Text组件：

对应返回String类型的情况 #

FutureBuilder<String>(
  future: getNumberIntervention(),
  builder: (context, snapshot) {
    if (snapshot.connectionState == ConnectionState.waiting) {
      // 加载中显示占位符
      return const Text('Loading...');
    } else if (snapshot.hasError) {
      // 加载失败显示错误信息
      return Text('Error: ${snapshot.error}');
    } else if (snapshot.hasData) {
      // 加载成功显示数据
      return Text('Interventions: ${snapshot.data}');
    } else {
      // 无数据时的占位
      return const Text('No data');
    }
  },
)

对应返回int类型的情况 #

只需调整FutureBuilder的泛型和显示逻辑：

FutureBuilder<int>(
  future: getNumberIntervention(),
  builder: (context, snapshot) {
    if (snapshot.connectionState == ConnectionState.waiting) {
      return const Text('Loading...');
    } else if (snapshot.hasError) {
      return Text('Error: ${snapshot.error}');
    } else if (snapshot.hasData) {
      return Text('Interventions: ${snapshot.data}');
    } else {
      return const Text('No data');
    }
  },
)

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