Flutter中Google登录完成后如何跳转至其他页面

针对你的场景，以下两种常用实现思路，结合你的代码逐一说明：

方法一：在登录页面监听状态变化跳转 #

因为你使用了ChangeNotifier，可以在调用googleLogin的登录页面，通过Consumer监听用户状态，当登录完成（user不为空）时触发页面跳转。

实现步骤： #

1. 假设你的登录页面是LoginPage，用Consumer<GoogleSignInProvider>包裹登录按钮：

class LoginPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Consumer<GoogleSignInProvider>(
          builder: (context, provider, child) {
            // 登录成功后触发跳转
            if (provider._user != null) {
              // 延迟执行避免状态更新冲突
              WidgetsBinding.instance.addPostFrameCallback((_) {
                Navigator.pushReplacement(
                  context,
                  MaterialPageRoute(builder: (context) => HomePage()), // 替换为你的目标页面
                );
              });
            }
            return ElevatedButton(
              onPressed: () => provider.googleLogin(),
              child: const Text('Google登录'),
            );
          },
        ),
      ),
    );
  }
}

这种方式的优势是页面跳转逻辑与UI耦合，状态管理类仅负责登录业务，符合单一职责原则。

方法二：使用全局导航键在Provider中跳转 #

如果希望直接在GoogleSignInProvider的googleLogin方法内完成跳转，可以定义全局NavigatorState键，无需上下文即可触发跳转。

实现步骤： #

1. 在项目主文件（如main.dart）中定义全局导航键：

final GlobalKey<NavigatorState> navigatorKey = GlobalKey<NavigatorState>();

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return ChangeNotifierProvider(
      create: (_) => GoogleSignInProvider(),
      child: MaterialApp(
        navigatorKey: navigatorKey, // 绑定全局导航键
        home: const LoginPage(),
      ),
    );
  }
}

2. 修改你的GoogleSignInProvider，在登录成功后添加跳转逻辑：

import 'package:firebase_auth/firebase_auth.dart';
import 'package:flutter/material.dart';
import 'package:google_sign_in/google_sign_in.dart';
// 导入全局导航键所在文件
import 'main.dart';

class GoogleSignInProvider extends ChangeNotifier {
  final googleSignIn = GoogleSignIn();
  GoogleSignInAccount? _user;
  GoogleSignInAccount get user => _user!;

  Future googleLogin() async{
    final googleUser = await googleSignIn.signIn();
    if (googleUser == null) return;

    _user = googleUser;
 
    final googleAuth = await googleUser.authentication;

    final credential = GoogleAuthProvider.credential(
      accessToken: googleAuth.accessToken,
      idToken: googleAuth.idToken,
    );
    await FirebaseAuth.instance.signInWithCredential(credential);
    
    // 登录成功后跳转页面
    navigatorKey.currentState?.pushReplacement(
      MaterialPageRoute(builder: (context) => const HomePage()), // 替换为你的目标页面
    );
    
    notifyListeners();
  }
}

注意事项： #

• 跳转建议使用pushReplacement，避免用户返回登录页；若需保留登录页栈，可改用push。
• 方法一中的addPostFrameCallback用于确保状态更新完成后再执行跳转，避免BuildContext异常。

内容的提问来源于stack exchange，提问作者JEFRI LUQMAN HAKIM JUNAIDE