Flutter中如何实现BottomNavBar常驻下的类Fragment页面导航？

这套需求完全对应原生开发里单Activity承载多Fragment、每个Fragment绑定独立Navigation Graph、底部导航全局常驻、切Tab不丢页面状态的经典架构，根本不需要自己手写组件存当前子页面，成熟的标准实现逻辑如下：

核心结构设计 #

• 最外层Scaffold固定承载全局BottomNavBar，body区域用IndexedStack承载每个底部Tab对应的独立导航容器
• 每个Tab对应的导航容器是一个独立的嵌套Navigator实例，而非单一页面组件，职责和原项目里对应位置的Fragment完全对齐
• 这种结构下，Tab内的所有子页面跳转都在所属的嵌套Navigator内完成，不会触发外层Scaffold重建，BottomNavBar会始终固定在屏幕底部，不会被子页面覆盖或顶走

状态保留的实现逻辑 #

• IndexedStack本身会为每个子节点保留完整的组件树和渲染状态，不会因为切换Tab销毁对应Tab的组件实例，刚好匹配原生Fragment的状态保留能力——切Tab回来时，页面的滚动位置、表单填写内容、加载好的列表数据都不会重置
• 每个嵌套Navigator会自动维护自身的页面栈历史：比如你在Tab1的商品列表页跳转到商品详情页，切到Tab2逛完再切回Tab1，会直接停留在之前的详情页，不会自动退回列表页，完全不需要手动维护栈结构和状态缓存

导航传参的实现 #

搭配官方维护的go_router路由配置能力，开发体验和原项目的Navigation Graph几乎一致：

• 给每个底部Tab配置独立的子路由分支，路由路径里可以直接定义需要传递的参数（比如/home/detail/:goodsId），跳转时直接把参数拼入路径，也可以通过extra字段传递复杂对象，和原生SafeArguments的传参逻辑完全对齐
• 可以在路由配置层统一做全局拦截，比如登录态校验、深链接跳转适配，不需要在每个Tab的嵌套Navigator里单独写判断逻辑

对比你之前设想的自定义方案的优势 #

• 不需要手动实现页面栈的push、pop、替换逻辑，从根源上避免栈顺序错乱、页面内存泄漏这类常见的自定义导航踩坑点
• 所有路由跳转逻辑可以集中管控，和原项目的导航图结构可以做1:1映射，迁移成本极低
• 自带符合平台规范的页面转场动画，可以通过自定义配置完全对齐原项目的原生交互细节

落地注意事项 #

• 所有Tab内的子页面跳转必须走对应Tab的嵌套Navigator，不要统一走最外层的根Navigator，否则会把子页面加载到最外层Scaffold层级，导致BottomNavBar被覆盖
• 给每个嵌套Navigator配置唯一的GlobalKey，避免切Tab时出现Navigator状态错乱
• 路由的extra参数只用来做单次跳转的临时数据传递，长期保留的页面状态仍然由对应页面的State维护，和原项目的状态管理逻辑保持边界一致

这套实现是目前Flutter迁移带全局底部导航应用的行业通用方案，不存在临时凑用的逻辑，可以100%覆盖你提到的所有需求。

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