首页 文章

appbar中的Flutter.io Navigator错误[重复]

提问于
浏览
0

这个问题在这里已有答案:

我决定试一试,偶然发现以下问题:

在我的应用程序中,我想在AppBar中有一个按钮,将用户带到另一个屏幕 . 但是,每当我尝试在任何IconButtons的onPressed处理程序中调用Navigator时,都会收到以下错误:

使用不包含导航器的上下文请求导航器操作 . 用于从导航器推送或弹出路由的上下文必须是作为Navigator小部件后代的小部件的上下文 .

这是我的 main.dart (减去进口):

void main() => runApp(new MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    var service = new ProjectService();

    return new MaterialApp(
        theme: new ThemeData(
          primaryColor: Colors.deepOrange,
        ),
        home: new Scaffold(
          appBar: new AppBar(
              title: new Text("My App Title"),
              actions: 
              <Widget>[
                new IconButton(
                    icon: new Icon(Icons.add),
                    onPressed: () =>
                        Navigator.of(context).pushNamed("/projects/add")) //<-- Here's where I get the exception
              ],
              elevation: 0.0),
          body: new Center(child: new ProjectList(projects: service.toList())), //<-- Exactly the same code runs fine here
          drawer: new AppDrawer(),
        ),
        routes: <String, WidgetBuilder>{
          '/projects/add': (BuildContext context) => new ProjectAddScreen(),
          '/projects/test': (BuildContext context) => new ProjectAddScreen(),
          '/settings': (BuildContext context) => new AppSettingsScreen(),
          '/about': (BuildContext context) => new AboutScreen()
        });
  }
}

这是构建应用程序实例的唯一位置, AppBar 是与flutter / material包捆绑在一起的标准 AppBar .

我的 flutter doctor 输出如果有任何相关性

[√] Flutter (Channel master, v0.2.5-pre.41, on Microsoft Windows [Version 10.0.16299.309], locale en-US)
[!] Android toolchain - develop for Android devices (Android SDK 26.0.2)
    X Android license status unknown. // I use the SDK manager from Visual Studio
[!] Android Studio (version 3.0)
    X Unable to determine bundled Java version. //I use the SDK manager from Visual Studio so I have no need in Android Studio
[√] VS Code, 64-bit edition (version 1.21.1)
[√] Connected devices (1 available)

1 回答

  • 0

    虽然雷米在他对这个问题的评论中指出(对不起,我不知道如何正确提及他的用户),但事实证明这是this thread的重复 . 但是因为我发现在那里提供的代码有点脱离了上下文,我认为值得一提的是我如何在我的特定用例中应用了那里提供的解决方案 .

    我做了一些调试,发现当我在 IconButtononPressed 处理程序中时,上下文不存在 IconButtonAppBar . 这是 MaterialApp 的 . 如果你问我这个问题既合乎逻辑又奇怪,特别是考虑到将相同的代码放入正文中心的工作 .

    但是,我打开了Stocks示例应用程序,看看他们如何构建应用程序,并简单地遵循他们在那里使用的模式 .

    这就是我最终得到的结果:

    main.dart

    void main() => runApp(new MyApp());
    
    class MyApp extends StatefulWidget {
    
      @override
      MyAppState createState() {
        return new MyAppState();
      }
    
    }
    
    class MyAppStateextends State<MyApp> {
    
      ProjectService _projectService;
    
      @override
      void initState() {
        super.initState();
        _projectService = new ProjectService();
      }
    
      @override
      Widget build(BuildContext context) {
        return new MaterialApp(
           title: "My App",
            theme: new ThemeData.light(),
            routes: <String, WidgetBuilder> {
              '/projects/add': (BuildContext context) => new HomeScreen(_projectService),
              '/': (BuildContext context) => new HomeScreen(_projectService)
            }
        );
      }
    }
    

    HomeScreen.dart

    class HomeScreen extends StatefulWidget {
      final ProjectService projectService;
    
      const HomeScreen(this.projectService);
    
      @override
      HomeScreenState createState() => new HomeScreenState();
    }
    
    class HomeScreenState extends State<HomeScreen> {
      void handleProjectUpdate() {
        setState(() => {});
      }
    
      @override
      Widget build(BuildContext context) {
        return new Scaffold(
          body: new ListView(
            children: widget.projectService.all().map<ListTile>((f) {
              return new ListTile(
                title: new Text(f.name),
              );
            }).toList(),
          ),
          appBar: new AppBar(
            actions: <Widget>[
              new IconButton(
                  icon: new Icon(Icons.add),
                  onPressed: () => Navigator.pushNamed(context, "/projects/add"))
            ],
          ),
        );
      }
    }
    

相关问题