我正在尝试通过单击按钮打开另一个活动，但它显示了一些错误答案

【问题标题】：I am trying to open another activity from a button click in flutter but it is showing some error我正在尝试通过单击按钮打开另一个活动，但它显示了一些错误
【发布时间】：2019-10-24 08:57:43
【问题描述】：

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData(primarySwatch: Colors.blue),
      home: Scaffold(
        appBar: AppBar(
          title: Text("Page 1"),
        ),
        body: Center(
          child: Column(
            children: <Widget>[
              MaterialButton(
                child: Text("Next Page"),
                onPressed: () {
                  Navigator.push(
                    context,
                    MaterialPageRoute(builder: (context) => nextPage()),
                  );
                },
                color: Colors.red,
              )
            ],
          ),
        ),
      ),
    );
  }
}

class nextPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData(primarySwatch: Colors.green),
      home: Scaffold(
        appBar: AppBar(
          title: Text("Page 2"),
        ),
        body: Center(
          child: Column(
            children: <Widget>[
              MaterialButton(
                child: Text("Go Back!"),
                onPressed: () {
                  Navigator.pop(context);
                },
                color: Colors.red,
              )
            ],
          ),
        ),
      ),
    );
  }
}

这是我用来导航到新页面的代码，但即使编译器没有抛出任何错误，我也遇到了问题

这是我收到的错误消息

引发了另一个异常：使用不包含导航器的上下文请求导航器操作。

单击按钮时出现此错误

【问题讨论】：

标签： flutter dart

【解决方案1】：

您需要 home : Builder( builder: (context) => 和 Second Page 删除 MaterialApp

MaterialApp(
      home: Builder(
        builder: (context) => Scaffold(
          appBar: AppBar(
            title: Text("Page 1"),
          ),
          body: Center(
            child: Column(
              children: <Widget>[
                MaterialButton(
                  child: Text("Next Page"),
                  onPressed: () {
                    Navigator.push(
                      context,
                      MaterialPageRoute(builder: (context) => nextPage()),
                    );
                  },
                  color: Colors.red,
                )
              ],
            ),
          ),
        ),
      ),

完整代码

    import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Builder(
        builder: (context) => Scaffold(
          appBar: AppBar(
            title: Text("Page 1"),
          ),
          body: Center(
            child: Column(
              children: <Widget>[
                MaterialButton(
                  child: Text("Next Page"),
                  onPressed: () {
                    Navigator.push(
                      context,
                      MaterialPageRoute(builder: (context) => nextPage()),
                    );
                  },
                  color: Colors.red,
                )
              ],
            ),
          ),
        ),
      ),
    );
  }
}

class nextPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("Page 2"),
      ),
      body: Center(
        child: Column(
          children: <Widget>[
            MaterialButton(
              child: Text("Go Back!"),
              onPressed: () {
                Navigator.pop(context);
              },
              color: Colors.red,
            )
          ],
        ),
      ),
    );
  }
}

【讨论】：

很高兴为您提供帮助。如果有帮助，请将此标记为答案，谢谢。

【解决方案2】：

试试这个

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData(primarySwatch: Colors.blue),
      home: Scaffold(
        appBar: AppBar(
          title: Text("Page 1"),
        ),
        body: Center(
          child: Column(
            children: <Widget>[
              MaterialButton(
                child: Text("Next Page"),
                onPressed: () {
                  Navigator.of(context).pushNamed(NextPage.routeName),
                  );
                },
                color: Colors.red,
              )
            ],
          ),
        ),
      ),
    );
  }
}

class NextPage extends StatelessWidget {
static const routeName = '/next-page';
  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          title: Text("Page 2"),
        ),
        body: Center(
          child: Column(
            children: <Widget>[
              MaterialButton(
                child: Text("Go Back!"),
                onPressed: () {
                  Navigator.of(context).pop();
                },
                color: Colors.red,
              )
            ],
          ),
      ),
    );
  }
}

【讨论】：

【解决方案3】：

您不能将导航器（在 MyApp 类中）与创建 MaterialApp() 之前获得的上下文一起使用。使用 Builder 包装您的 MaterialButton，如下所示：

children: <Widget>[
            Builder(
              builder: (BuildContext innerContext) {
                 MaterialButton(
                  child: Text("Go Back!"),
                  onPressed: () {
                    Navigator.pop(innerContext);
                  },
                  color: Colors.red,
                )
             }
            );
         ],

除此之外，还有一些问题：

我还会考虑将 onWillPop 属性用于所有这些 android 用例。
在导航您的应用时永远不要使用另一个 MaterialApp()，例如对孩子使用 Scaffold()。

【讨论】：

【解决方案4】：

您也可以将 MaterialApp Widget 移动到 main()

main() => runApp(
  MaterialApp(
    theme: ThemeData(primarySwatch: Colors.blue),
    home: MyApp(),
  ),
);

并将其从其他类中删除。

您的应用只需要一个 MaterialApp 小部件。正如您在文档中看到的那样，它就像配置顶级导航器的“根”小部件。

【讨论】：