Flutter技术问题：FutureBuilder出错后如何实现重试功能？

你的代码里存在一个核心问题：传入的widget.future是一个已创建好的Future实例，这个Future一旦执行完成（无论成功或失败），后续再await它只会直接返回之前的结果，不会重新发起请求，这就是点击重试按钮后FutureBuilder不重建的原因。

要实现正常的重试功能，需要做以下调整：

• 将组件接收的参数从直接的Future改为返回Future的函数，确保每次重试都能生成全新的请求Future
• 适配内部状态与方法，支持新的参数类型

修改后的完整代码 #

class FutureResponseBuilder<T> extends StatefulWidget {
  // 替换为返回Future的函数，而非固定的Future实例
  final Future<T> Function() futureProvider;
  final Widget Function(T) onSuccess;

  const FutureResponseBuilder({
    required this.futureProvider,
    required this.onSuccess,
    super.key,
  });

  @override
  State<FutureResponseBuilder<T>> createState() =>
      _FutureResponseBuilderState<T>();
}

class _FutureResponseBuilderState<T> extends State<FutureResponseBuilder<T>> {
  late Future<T> future = _callAPI();

  Future<T> _callAPI() async {
    // 调用函数获取全新的请求Future
    return await widget.futureProvider();
  }

  @override
  Widget build(BuildContext context) {
    return FutureBuilder<T>(
      future: future,
      builder: (context, snapshot) {
        if (snapshot.connectionState == ConnectionState.done) {
          if (snapshot.hasError) {
            return Column(
              mainAxisAlignment: MainAxisAlignment.center,
              crossAxisAlignment: CrossAxisAlignment.center,
              children: [
                const Text('OOPS!'),
                Text('${snapshot.error}'),
                const Text('Please try again.'),
                SizedBox(
                  width: 100,
                  child: FilledButton(
                    child: const Text('OK'),
                    onPressed: () {
                      // 重试时生成新的Future并更新状态
                      setState(() {
                        future = _callAPI();
                      });
                    },
                  ),
                ),
              ],
            );
          } else if (snapshot.hasData) {
            return widget.onSuccess(snapshot.data!);
          }
        }
        return const Center(child: CircularProgressIndicator());
      },
    );
  }
}

关键修改说明 #

1. 参数类型变更：把final Future future换成final Future<T> Function() futureProvider，外部使用时需要传入一个生成请求的函数，比如() => apiService.fetchUserData()，而不是直接传入apiService.fetchUserData()（后者会立即执行并生成固定的Future）。
2. 重试逻辑优化：点击重试按钮时，通过futureProvider()获取全新的请求Future，赋值给future后调用setState，此时FutureBuilder会监听新的Future，重新发起请求并更新UI。
3. 类型安全提升：明确指定FutureBuilder<T>，移除强制类型转换as T，让代码更安全规范。

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