使用go_router登录跳转后Flutter图片资源加载失败求助

1. 优先排查路由重定向循环问题 #

当前每个路由单独设置redirect的方式，很容易触发无限重定向循环——比如登录状态切换后，Home和Login路由的redirect会互相触发跳转，导致Router持续刷新，最终阻塞开发服务器。

修改方案：将重移至全局级别，替换单个路由的redirect

GoRouter routerGenerator(UserData userData) {
  return GoRouter(
    initialLocation: Routes.home,
    refreshListenable: userData,
    debugLogDiagnostics: true,
    // 全局统一处理重定向逻辑
    redirect: (state) {
      final loggedIn = userData.loggedIn;
      final currentLocation = state.location;

      // 未登录且不在登录页，跳转登录
      if (!loggedIn && currentLocation != Routes.login) {
        return Routes.login;
      }
      // 已登录且不在首页/根路径，跳转首页
      if (loggedIn && currentLocation != Routes.home && currentLocation != '/') {
        return Routes.home;
      }
      // 其他情况不触发重定向
      return null;
    },
    routes: [
      GoRoute(
        path: Routes.home,
        builder: (_, __) => BasicScreen(),
        // 移除单个路由的redirect
      ),
      GoRoute(
        path: Routes.login,
        builder: (_, __) => AnimLoginScreen(),
        // 移除单个路由的redirect
      ),
      GoRoute(path: '/', builder: (_, __) => BasicScreen())
    ],
  );
}

2. 优化图片加载方式 #

直接使用AssetImage可能在路由跳转后出现资源加载上下文异常，换成Image.asset（内部封装了更完善的缓存和错误处理逻辑）：

class BasicScreen extends StatelessWidget {
  const BasicScreen({super.key});

  @override
  Widget build(BuildContext context) {
    return Container(
      child: Column(
        children: [
          Image.asset("assets/images/image1.png"),
          Image.asset("assets/images/image2.png"),
          Image.asset("assets/images/image3.png"),
        ],
      ),
    );
  }
}

同时确认pubspec.yaml中资源配置为目录形式（确保所有图片被正确打包）：

assets:
  - assets/images/

3. 检查状态管理的通知逻辑 #

UserData作为refreshListenable，状态变化时必须调用notifyListeners()，否则Router无法感知登录状态更新，可能引发异常跳转：

class UserData extends ChangeNotifier {
  bool _loggedIn = false;
  bool get loggedIn => _loggedIn;

  void login() {
    _loggedIn = true;
    notifyListeners(); // 必须调用此方法通知Router刷新
  }

  void logout() {
    _loggedIn = false;
    notifyListeners();
  }
}

4. 规范登录后的跳转方式 #

登录成功后使用context.go()而非push类方法，避免Login页面留在路由栈中导致资源堆积：

// 在AnimLoginScreen的登录成功回调中
context.go(Routes.home);

5. 排查开发服务器挂起原因 #

• 打开Flutter DevTools的Performance面板，查看CPU/内存占用，确认是否存在无限循环函数调用；
• 尝试在Release模式下运行应用，排除开发模式调试逻辑的干扰；
• 清理Flutter缓存（执行flutter clean后重新运行），避免缓存资源冲突。

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