Flutter中“Don't use BuildContext across sync gaps”错误原因咨询

问题原因 #

你这段代码里的核心问题是：在异步操作完成后直接使用了原BuildContext。await _auth.createUserWithEmailAndPassword是耗时的异步调用，在等待结果的过程中，当前Widget可能已经被销毁（比如用户中途返回上一页），此时再用这个context调用Navigator会存在潜在风险，Flutter的lint规则会检测到这种跨异步间隙使用context的情况，所以给出了警告。

你添加的await Future.delayed(Duration.zero)并没有解决本质问题，它只是把代码推迟到下一个事件循环执行，但context失效的风险依然存在。

解决方法 #

方法1：检查Widget是否仍挂载（StatefulWidget适用） #

利用State类的mounted属性，在使用context前判断当前Widget是否还挂载在Widget树上：

onPressed: () async {
  try {
    final newUser = await _auth.createUserWithEmailAndPassword(email: email, password: password);
    if (newUser.user != null && mounted) {
       Navigator.of(context).pushNamed(ChatScreen.id);
    }
  } catch (e) {
    print(e);
  }
},

方法2：使用全局NavigatorKey #

提前定义一个全局的NavigatorKey，导航时直接用它，完全脱离对当前context的依赖：

1. 在App顶层定义key：

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

2. 在MaterialApp中配置：

MaterialApp(
  navigatorKey: navigatorKey,
  // 其他配置项
)

3. 回调中使用key导航：

onPressed: () async {
  try {
    final newUser = await _auth.createUserWithEmailAndPassword(email: email, password: password);
    if (newUser.user != null) {
       navigatorKey.currentState?.pushNamed(ChatScreen.id);
    }
  } catch (e) {
    print(e);
  }
},

方法3：使用context.mounted（Flutter 3.7+） #

如果你的Flutter版本在3.7及以上，可以直接用context.mounted替代State的mounted属性，StatelessWidget也能使用：

onPressed: () async {
  try {
    final newUser = await _auth.createUserWithEmailAndPassword(email: email, password: password);
    if (newUser.user != null && context.mounted) {
       Navigator.of(context).pushNamed(ChatScreen.id);
    }
  } catch (e) {
    print(e);
  }
},

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