Flutter Dart中async/await未按预期工作，如何强制等待异步任务完成？

问题根源 #

1. 你定义的匿名异步函数仅做了声明，没有执行（缺少()调用），导致checkConnection一开始根本没触发，isDeviceConnected自然是null。
2. 就算调用了这个匿名函数，build方法是同步执行的，不会等待异步操作完成就直接执行后续的if判断，此时isDeviceConnected依然是null，逻辑必然出错。

正确解决方案：用FutureBuilder处理异步UI更新 #

Flutter提供了FutureBuilder组件，专门用来处理依赖异步任务结果的UI渲染，它会监听异步任务的状态，动态返回对应UI。

修改后的完整代码：

import 'package:flutter/material.dart';
import 'package:internet_connection_checker/internet_connection_checker.dart';

class RedirectPage extends StatelessWidget {
  final int? status;

  RedirectPage({this.status});

  // 简化网络检测方法，无需nullable返回值
  Future<bool> checkConnection() async {
    return await InternetConnectionChecker().hasConnection;
  }

  @override
  Widget build(BuildContext context) {
    return FutureBuilder<bool>(
      // 传入要执行的异步任务
      future: checkConnection(),
      builder: (context, snapshot) {
        // 异步任务正在执行时，显示加载状态
        if (snapshot.connectionState == ConnectionState.waiting) {
          return const Center(child: CircularProgressIndicator());
        }

        // 任务完成后，获取网络状态（默认设为false避免null）
        bool isDeviceConnected = snapshot.data ?? false;
        
        // 根据网络状态返回对应页面
        if (!isDeviceConnected) {
          return AppNetworkConnectivityHome();
        } else {
          return HomePage();
        }
      },
    );
  }
}

代码说明 #

• 简化checkConnection方法，直接返回Future<bool>，因为hasConnection必然会返回一个布尔值，不需要nullable类型。
• 用FutureBuilder包裹整个页面逻辑，通过snapshot获取异步任务的状态和结果：
  • 当任务处于等待状态时，显示加载指示器，避免页面直接跳转导致的逻辑错误。
  • 任务完成后，从snapshot.data中取出网络状态，默认设为false处理异常情况，再执行页面跳转逻辑。

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