如何使用Flutter与Firebase实现基于角色的登录跳转

你需要在用户登录状态下，异步查询Firestore中对应用户的type字段，根据字段值跳转页面。可以通过FutureBuilder来实现异步数据获取和页面渲染：

修改后的AuthPage代码如下：

import 'package:cloud_firestore/cloud_firestore.dart';
import 'package:firebase_auth/firebase_auth.dart';
import 'package:flutter/material.dart';
import 'package:modernlogintute/pages/admin_page.dart';
import 'package:modernlogintute/pages/location_page.dart';
import 'package:firebase_core/firebase_core.dart';
import 'package:modernlogintute/pages/login_page.dart';
import 'home_page.dart';
import 'login_or_register_page.dart';
// 记得导入StudentPage，根据你的实际文件路径调整
import 'package:modernlogintute/pages/student_page.dart';

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

  // 异步获取用户类型
  Future<String?> getUserType() async {
    final currentUser = FirebaseAuth.instance.currentUser;
    if (currentUser == null) return null;
    
    final userDoc = await FirebaseFirestore.instance
        .collection('users')
        .doc(currentUser.uid)
        .get();
    
    return userDoc.data()?['type'] as String?;
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: StreamBuilder<User?>(
        stream: FirebaseAuth.instance.authStateChanges(),
        builder: (context, snapshot) {
          // 用户已登录
          if (snapshot.hasData) {
            return FutureBuilder<String?>(
              future: getUserType(),
              builder: (context, userTypeSnapshot) {
                // 数据加载中显示加载动画
                if (userTypeSnapshot.connectionState == ConnectionState.waiting) {
                  return const Center(child: CircularProgressIndicator());
                }
                
                // 根据用户类型跳转对应页面
                final userType = userTypeSnapshot.data;
                if (userType == 'Admin') {
                  return const AdminPage();
                } else if (userType == 'Student') {
                  return const StudentPage();
                } else {
                  // 类型未知或无数据时的默认页面，可按需修改
                  return const LocationPage();
                }
              },
            );
          }

          // 用户未登录
          else {
            return const LoginOrRegisterPage();
          }
        },
      ),
    );
  }
}

关键说明： #

• getUserType方法：通过当前登录用户的UID，查询Firestore中users集合的对应文档，提取type字段值。
• FutureBuilder：处理异步获取用户类型的过程，加载时显示加载指示器，加载完成后根据type值渲染对应页面。
• 兜底逻辑：如果用户类型不存在或查询失败，会跳转到默认的LocationPage，你可以根据需求修改这个兜底页面。

内容的提问来源于stack exchange，提问作者Nevzat Efe Özgül