我正在使用Flutter auto_route 进行嵌套导航,我希望将数据(AppBar
-title的动态字符串和floatingActionButton的Widget
)从嵌套路由传递到外部路由(根据路由树,从向上两级)。
导航(树)具有以下结构:
@MaterialAutoRouter(
routes: <AutoRoute>[
AutoRoute(
page: MainNavigationView,
children: [
AutoRoute(
path: 'manage',
page: EmptyRouterPage,
name: 'ManageRouter',
children: [
AutoRoute(
path: 'object',
page: ObjectView,
initial: true,
),
AutoRoute(
path: 'detail',
page: ObjectDetailView,
),
]
)
]
)
]
)
“我的页面”使用嵌套导航,其中MainNavigationView
表示Scaffold
,它包含AppBar
和SpeedDial
作为Scaffold
的floatingActionButton
:
class MainNavigationView extends StatefulWidget {
...
}
class _MainNavigationViewState extends State<MainNavigationView> {
final GlobalKey<ScaffoldState> _scaffoldkey = GlobalKey<ScaffoldState>();
@override
Widget build(BuildContext context) {
return AutoTabsRouter(
routes: [
const ManageRouter(),
...
],
builder: (context, child, __) {
final tabsRouter = AutoTabsRouter.of(context);
return Scaffold(
key: _scaffoldkey,
appBar: AppBar(...), //Title needs to be set dynamically
body: child,
floatingActionButton: SpeedDial(
... //This needs to be set dynamically
),
...
);
},
);
}
...
}
在路径ManageRouter
中,我可以从ObjectView
导航到ObjectDetailView
。在这两个视图中,我需要为AppBar传递一个动态字符串,并为floatingActionButton
传递必要的对象。
我想到的唯一解决方案是Provider
,因为MainNavigationView
允许我以一种解耦的方式发送数据。
更新日期:
我研究了其他几个解决方案,但没有一个解决方案的场景是父路由器中有一个scaffold,嵌套的路由器向父路由器Scaffold
传递值。(例如go_router
)是MainNavigationView
中的Scaffold
,具有bottomNavigationBar
属性集,但没有appBar
或floatingBottons
属性集。(通过ManageRouter
的Object
/ObjectDetail
)具有其自己的Scaffold
,并为appBar
和bottomNavigationBar
设置了属性。
我尝试过用状态管理解决方案(如Provider
)来解决这个问题,但除了在构建时触发notifyListeners()
-action的问题之外(因为我把notifyListeners()
操作放在了嵌套内容的build-method中)我遇到了一个关于堆栈管理的问题。处理这个逻辑,伴随着bottomNavigationBar的副作用,它有自己的堆栈,我认为这是一个架构问题。
我仍然感谢大家的努力和关注!
1条答案
按热度按时间c2e8gylq1#
我认为自动路由器包没有任何功能来传递嵌套路由之间的参数。您的情况可以解决得更容易!
AutoTabsRouter具有名为activeIndex的字段。当您从MainNavigationView子项中选择页面时,此字段将在AutoTabsRouter生成器方法中更新。
我在我的应用程序中使用它在bottomNavigationBar中显示所选页面图标,在appBar中显示所选页面标题。
针对您的情况的解决方案: