Flutter：特定页面接收通知时禁止显示AlertDialog的问题排查

问题根源分析 #

之前用UserPreferences持久化存储页面状态的方式有硬伤：

• 持久化存储不适合实时页面状态判断，一旦存储值更新不及时或出错，后续所有判断都会失效
• 页面跳转时的状态更新逻辑大概率有遗漏，比如进入chatScreen后没更新存储值，或者返回时没重置
• 通知触发时的判断逻辑依赖了过期的持久化数据，而非当前页面的实时状态

具体修复步骤 #

1. 替换持久化存储为实时状态跟踪 #

放弃UserPreferences，改用全局状态（或项目已有的状态管理库）实时记录当前页面：

// 用简单全局变量做示例，复杂项目建议集成到Provider/GetX/Bloc中
class AppRouteState {
  static String? currentRouteName;
}

2. 监听路由变化，实时更新状态 #

在main.dart的路由配置里加监听，确保页面跳转时状态同步更新：

final GlobalKey<NavigatorState> navigatorKey = GlobalKey<NavigatorState>();

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      navigatorKey: navigatorKey,
      // ...其他配置
      navigatorObservers: [
        NavigatorObserver(
          didPush: (route, prevRoute) {
            AppRouteState.currentRouteName = route.settings.name;
          },
          didPop: (route, prevRoute) {
            AppRouteState.currentRouteName = prevRoute?.settings.name;
          },
          didReplace: (newRoute, oldRoute) {
            AppRouteState.currentRouteName = newRoute.settings.name;
          },
        ),
      ],
      routes: {
        '/home': (_) => HomePage(),
        '/chat': (_) => ChatListPage(),
        '/chatScreen': (_) => ChatScreen(),
        // ...其他路由
      },
    );
  }
}

3. 重写通知触发判断逻辑 #

收到消息时，直接用实时路由状态判断是否弹窗：

// 消息接收回调函数
void handleNewMessage(Message newMsg) {
  // 定义所有聊天相关的路由名称，按实际项目调整
  const chatRelatedRoutes = ['/chat', '/chatScreen'];
  
  if (!chatRelatedRoutes.contains(AppRouteState.currentRouteName)) {
    // 不在聊天页面，弹出通知弹窗
    showDialog(
      context: navigatorKey.currentContext!,
      builder: (ctx) => AlertDialog(
        title: const Text('新消息'),
        content: Text(newMsg.content),
        actions: [
          TextButton(
            onPressed: () => Navigator.pop(ctx),
            child: const Text('忽略'),
          ),
          TextButton(
            onPressed: () {
              Navigator.pop(ctx);
              // 跳转到对应聊天详情页，传入聊天ID参数
              Navigator.pushNamed(
                ctx,
                '/chatScreen',
                arguments: {'chatId': newMsg.chatId},
              );
            },
            child: const Text('查看'),
          ),
        ],
      ),
    );
  }
}

4. 优化ChatScreen内的消息处理 #

在chatScreen.dart里，收到当前聊天的消息时直接更新界面，不触发弹窗：

class ChatScreen extends StatefulWidget {
  final String chatId;
  const ChatScreen({Key? key, required this.chatId}) : super(key: key);

  @override
  State<ChatScreen> createState() => _ChatScreenState();
}

class _ChatScreenState extends State<ChatScreen> {
  final List<Message> _messages = [];
  final ScrollController _scrollController = ScrollController();

  @override
  void initState() {
    super.initState();
    // 监听当前聊天的消息推送
    MessageManager.listenToChat(widget.chatId, (msg) {
      setState(() {
        _messages.add(msg);
      });
      // 自动滚动到最新消息
      _scrollController.jumpTo(_scrollController.position.maxScrollExtent);
    });
  }

  // ...聊天界面的其他代码
}

5. 清理旧逻辑 #

删掉所有和UserPreferences存储页面状态相关的代码，避免新旧逻辑冲突。

额外建议 #

• 如果项目已经在用Provider/Bloc等状态管理库，把当前路由状态集成到现有状态中，别用全局变量
• 测试时覆盖全场景：主页进聊天列表、进详情页、返回主页、后台切前台，确保判断逻辑稳定

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