首页 文章

Flutter Navigator无法正常工作

提问于
浏览 次
3

我有两个屏幕的应用程序，我想按下按钮从第一个屏幕到第二个屏幕 .

Screen 1

import 'package:flutter/material.dart';
import './view/second_page.dart';

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

class MyApp extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return new MainScreen();
  }
}

class MainScreen extends State<MyApp> {

  @override
  void initState() {
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
        home: new Scaffold(
            appBar: new AppBar(
                title: new Text("Title")
            ),
            body: new Center(
                child: new FlatButton(child: new Text("Second page"),
                    onPressed: () {
                      Navigator.push(context,
                          new MaterialPageRoute(
                              builder: (context) => new SecondPage()))
                    }
                )
            )
        )
    );
  }
}

Screen 2

import 'package:flutter/material.dart';

class SecondPage extends StatefulWidget {

  @override
  State<StatefulWidget> createState() {
    return new SecondPageState();
  }
}


class SecondPageState extends State<SecondPage> {

  @override
  void initState() {
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(
        title: new Text("Title"),
      ),
      body: new Center(
        child: new Text("Some text"),
      ),
    );
  }
}

推动没有发生，我得到了这个

处理手势时抛出以下断言：使用不包含导航器的上下文请求导航器操作 . 用于从导航器推送或弹出路由的上下文必须是作为Navigator窗口小部件后代的窗口小部件的上下文 . 引发了另一个异常：使用不包含导航器的上下文请求导航器操作 .

怎么了？

dart flutter

3 回答

  • 0

    将Flutter中的小部件视为一棵树，上下文指向使用构建函数构建的任何节点 . 在你的情况下，你有

    MainScreen    <------ context
  --> MaterialApp
   (--> Navigator built within MaterialApp)
      --> Scaffold
        --> App Bar
          --> ...
        --> Center
          --> FlatButton

    因此，当您使用上下文查找导航器时，您正在使用MainScreen的上下文，该上下文不在导航器下 .

    您可以创建一个新的Stateless或Stateful Widget子类来包含您的Center FlatButton，因为其中的构建函数将指向该级别，或者您可以使用Builder并定义 builder 回调（其具有指向Builder的上下文） ）返回Center FlatButton .

    回复于
  • 5

    无法找到路线的主要原因有两个 .

    1）路由定义 below the context 传递给Navigator.of（context） - @rmtmackenzie解释的场景

    2）路线定义为 on the sibling branch ，例如

    Root 

  -> Content (Routes e.g. Home/Profile/Basket/Search)

  -> Navigation (we want to dispatch from here)

    如果我们想从Navigation小部件调度路由，我们必须知道对NavigatorState的引用 . 拥有全局引用非常昂贵，尤其是当您打算在树中移动窗口小部件时 . https://docs.flutter.io/flutter/widgets/GlobalKey-class.html . 仅在无法从Navigator.of（上下文）获取它的情况下使用它 .

    要在MaterialApp中使用GlobalKey定义navigatorKey

    final navigatorKey = GlobalKey<NavigatorState>();

Widget build(BuildContext context) => MaterialApp {
    navigatorKey: navigatorKey
    onGenerateRoute : .....
};

    现在应用程序中您传递navigatorKey的任何地方都可以调用

    navigatorKey.currentState.push(....);

    刚发布了关于它https://medium.com/@swav.kulinski/flutter-navigating-off-the-charts-e118562a36a5

    回复于
  • 0

    只需在main方法中创建MaterialApp类作为此示例

    void main() => runApp(MaterialApp(home: FooClass(),));

    它适用于我，我希望它会工作

    回复于

相关问题