在导航器内的页面列表中找不到 MaterialPage

Question

我正在尝试实现course in AWS 以在 Flutter 中连接 Amplify。但是在“创建身份验证流程”中，当它在pages 中添加MaterialPage 时，在Navigator 中找不到它。 我在MaterialPage 中有这个错误：

没有为类型“_MyAuthStateState”定义方法“MaterialPage”。尝试将名称更正为现有方法的名称，或定义名为“MaterialPage”的方法。

我当前的代码（main.dart）：

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

class _MyAppState extends State<MyApp> {
  final _authService = AuthService();

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Photo Gallery App',
      theme: ThemeData(visualDensity: VisualDensity.adaptivePlatformDensity),
      home: StreamBuilder<AuthState>(
          // 2
          stream: _authService.authStateController.stream,
          builder: (context, snapshot) {
            // 3
            if (snapshot.hasData) {
              return Navigator(
                pages: [
                  // 4
                  // Show Login Page
                  if (snapshot.data.authFlowStatus == AuthFlowStatus.login)
                    MaterialPage(
                      child: LoginPage(
                        shouldShowSignUp: _authService.showSignUp,
                        didProvideCredentials:
                            _authService.loginWithCredentials,
                      ),
                    ),
                  // 5
                  // Show Sign Up Page
                  if (snapshot.data.authFlowStatus == AuthFlowStatus.signUp)
                    MaterialPage(
                        child: SignUpPage(
                      shouldShowLogin: _authService.showLogin,
                      didProvideCredentials: _authService.signUpWithCredentials,
                    )),
                  if (snapshot.data.authFlowStatus ==
                      AuthFlowStatus.verification)
                    MaterialPage(
                        child: VerificationPage(
                            didProvideVerificationCode:
                                _authService.verifyCode))
                ],
                onPopPage: (route, result) => route.didPop(result),
              );
            } else {
              // 6
              return Container(
                alignment: Alignment.center,
                child: CircularProgressIndicator(),
              );
            }
          }),
    );
  }
}

Answer 1

我猜你在initState 中的_authService.showLogin() 正在尝试执行一些导航，即显示一个小部件。由于 MyApp 不会自动将自身连接到顶级 Navigator，因此您无法访问/使用 Navigator 功能。

MaterialApp 会自动为您连接顶级 Navigator。

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    // ↓ Make MaterialApp your root widget
    return MaterialApp(
      title: 'Photo Gallery App',
      theme: ThemeData(visualDensity: VisualDensity.adaptivePlatformDensity),
      home: MyAuthStatePage(),
    )
  }
}

class MyAuthStatePage extends StatefulWidget {
  @override
  State<StatefulWidget> createState() => MyAuthState();
}

class MyAuthState extends State<MyAuthStatePage> {
  final _authService = AuthService();

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

  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    _authService.showLogin();
  }
}

另外，initState 概率。不是导航/显示小部件的正确位置，而是用于准备将由构建方法中的小部件使用的状态。