导航器操作请求的上下文不包含导航器

Question

我在这个链接中找到了以下错误的解释：Navigator operation requested with a context that does not include a Navigator 我试图申请我的问题，但我无法解决问题。

当我单击 NavigationBar 类中的按钮时，出现此错误：

在处理手势时引发以下断言：使用不包含导航器的上下文请求导航器操作。用于从 Navigator 推送或弹出路由的上下文必须是作为 Navigator 小部件后代的小部件的上下文。

void main() async {
  await Firebase.initializeApp();
  runApp(MyApp());
}

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  @override
  void initState() {
    super.initState();

    AppRouter appRouter = AppRouter(
      routes: AppRoutes.routes,
      notFoundHandler: AppRoutes.routeNotFoundHandler,
    );

    appRouter.setupRoutes();
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'abc',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      builder: (_, child) => AppView(
        child: child,
      ),
      onGenerateRoute: AppRouter.router.generator,
      );
  }
}

class AppView extends StatelessWidget {
  
final Widget child;
  
const AppView({@required this.child});
  
@override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Column(
        children: [NavigationBar(), Expanded(child: child)],
      ),
    );
  }
}

class NavigationBar extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
      child: Row(
        mainAxisSize: MainAxisSize.max,
        mainAxisAlignment: MainAxisAlignment.end,
        children: [
          Container(
            child: MaterialButton(
              child: Text(
                "Home",
              ),
              onPressed: () {
                AppRouter.router
                    .navigateTo(context, AppRoutes.saticilarRoute.route);
              },
            ),
          ),
           //TODO
        ],
      ),
    );
  }
}

Answer 1

出现这个问题的原因：

构建器返回的任何小部件都将是导航器的父级。

如果您希望在所有页面上都使用持久导航栏，那么您可以使用构建器。

// Need to pass the child to navigation bar which is not a good solution
class NavigationBar extends StatelessWidget {
const NavigationBar({Key key, this.child}: super(key:key))
final Widget child;

// Replace this
AppRouter.router.navigateTo(context, AppRoutes.saticilarRoute.route);

// with
(child.key as GlobalKey<NavigatorState>).currentState.pushNamed(AppRoutes.saticilarRoute.route)

Persisting AppBar Drawer across all Pages Flutter

或者你可以使用导航键，看看这个。 How to navigate without context in flutter app?

更好的办法是将导航栏放在一个单独的文件中，并在需要时重复使用。删除生成器并使用home/initialRoute。