Flutter中实现无BuildContext跳转

背景说明

做一个小工具时,想执行路由后退,但这需要BuildContext对象, 于是就近随便找了一个BuildContext对象,结果flutter出现错误:

FlutterError (Looking up a deactivated widget's ancestor is unsafe. At this point the state of the widget's element tree is no longer stable. To safely refer to a widget's ancestor in its dispose() method, save a reference to the ancestor by calling dependOnInheritedWidgetOfExactType() in the widget's didChangeDependencies() method.)

原因

我们在哪里执行路由pop()ScaffoldMessenger相关操作,就必须用对应widgetBuildContext, 有时候还会出现比较绕的情况,比如:你在A组件中定义了个方法,该方法中执行了路由跳转,但该方法你实际是以传参的方式传到了B组件甚至C组件中执行,那此时如果你用A组件的BuildContext那就会报错,实际在哪里执行,就必须用哪个组件的BuildContext对象

解决方案

MaterialApp的构造函数有个navigatorKey的参数,定义一个全局的GlobalKey<NavigatorState>, 再在需要使用当前BuildContext的地方,直接从GlobalKey<NavigatorState>中获取即可

navigator_util.dart

dart 复制代码
import 'package:flutter/material.dart';

class NavigatorStateUtil {
  // 需要先配置到MaterialApp的navigatorKey属性才可真正使用
  static final GlobalKey<NavigatorState> globalNavigatorKey =
      GlobalKey<NavigatorState>();
}

使用NavigatorStateUtil

MaterialApp初始化时,配置上去

在需要BuildContext的地方,通过NavigatorStateUtil获取

参考资料

Flutter中实现无Context跳转 - 掘金 (juejin.cn)

flutter的无context全局实现路由跳转 - 掘金 (juejin.cn)

Flutter 中由 BuildContext 引发的血案 - 知乎 (zhihu.com)

Flutter之基本路由,命名路由跳转,返回上一页,替换路由和返回根路由------Flutter基础系列_flutter go_router 返回_houruoyu3的博客-CSDN博客

Flutter 不利用 BuildContext 跳转页面_flutter中如何实现无context跳转详解-CSDN博客

相关推荐
Ranye1236 小时前
从 JS 到 Dart:语法基础
javascript·flutter·dart
我要最优解13 小时前
关于在mac中配置Java系统环境变量
java·flutter·macos
江上清风山间明月2 天前
Flutter开发的应用页面非常多时如何高效管理路由
android·flutter·路由·页面管理·routes·ongenerateroute
Zsnoin能2 天前
flutter国际化、主题配置、视频播放器UI、扫码功能、水波纹问题
flutter
早起的年轻人2 天前
Flutter CupertinoNavigationBar iOS 风格导航栏的组件
flutter·ios
HappyAcmen2 天前
关于Flutter前端面试题及其答案解析
前端·flutter
coooliang3 天前
Flutter 中的单例模式
javascript·flutter·单例模式
coooliang3 天前
Flutter项目中设置安卓启动页
android·flutter
JIngles1233 天前
flutter将utf-8编码的字节序列转换为中英文字符串
java·javascript·flutter
B.-3 天前
在 Flutter 中实现文件读写
开发语言·学习·flutter·android studio·xcode