例外：使用不包含导航器的上下文请求导航器操作答案

【问题标题】：Exception : Navigator operation requested with a context that does not include a Navigator例外：使用不包含导航器的上下文请求导航器操作
【发布时间】：2025-12-05 07:40:02
【问题描述】：

这个错误有很多解决办法。但我收到了这个错误。我在这个网站上尝试了几种方法。但无法得到解决方案。这是我的代码

@override
Widget build(BuildContext context) {

 // TODO: implement build
 SystemChrome.setEnabledSystemUIOverlays([]);

 return MaterialApp(
  routes: <String, WidgetBuilder>{
    '/homepage': (context) => MyApp(),
    '/loginpage': (BuildContext context) => new LoginPage()
  },
  home: Scaffold (
    body: Center(
      child: GestureDetector(
        onTap: () {

        Navigator.of(context).pushNamed('/loginpage');
        },
        child: Image(
          width: 100.0,
          height: 100.0,
          image: AssetImage('assets/images/icon.png'),
        ),
      )

    ),

  ),
 );
}

【问题讨论】：

使用MaterialApp.navigatorKey属性

标签： flutter exception routes navigator

【解决方案1】：

您可以用Builder 小部件包装您的Scaffold，它会为您提供上下文。

这是更新的代码

@override
Widget build(BuildContext context) {
SystemChrome.setEnabledSystemUIOverlays([]);

return MaterialApp(
  routes: <String, WidgetBuilder>{
    '/homepage': (context) => MyApp(),
    '/loginpage': (BuildContext context) => new LoginPage()
  },
  home: Builder(
    builder:(context)=>Scaffold (
      body: Center(
        child: GestureDetector(
          onTap: () {
            Navigator.of(context).pushNamed('/loginpage');
          },
          child: Image(
            width: 100.0,
            height: 100.0,
            image: AssetImage('assets/images/icon.png'),
          ),
        ),
       ),
      ),
     ),
   );
 }

希望这会有所帮助！

【讨论】：

【解决方案2】：

发生这种情况是因为您使用它的上下文没有导航器工作所需的材料应用程序，build 小部件中使用的上下文来自发送给它的子级的父级，所以在这个如果父级是您的主要应用程序类，它没有材料应用程序，因此您可以按照答案之一的建议使用Builder 小部件，或者您可以创建一个单独的小部件并将其分配给home参数，像这样：

你的无状态小部件：

class MyHomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold (
      body: Center(
          child: GestureDetector(
            onTap: () {
              Navigator.of(context).pushNamed('/loginpage');
            },
            child: Image(
              width: 100.0,
              height: 100.0,
              image: AssetImage('assets/images/icon.png'),
            ),
          )

      ),

    );
  }
}

使用它作为 home 参数 home: MyHomePage().

【讨论】：

【解决方案3】：

你可以在这个链接看到答案

https://*.com/questions/44004451/navigator-operation-requested-with-a-context-that-does-not-include-a-navigator

【讨论】：