Flutter中如何使用Provider状态管理构建并调用SplashScreen？

首先说结论：基础的SplashScreen完全不需要Provider支持。哪怕你不引入任何第三方状态管理库，只要在Splash组件里加个定时逻辑、完成路由跳转，最基础的启动页功能就完全能实现。
只有当Splash流程和全局状态深度绑定时，引入Provider才是有实际价值的，常见的场景包括：

• Splash阶段需要执行跨页面共享的初始化逻辑（比如用户登录态校验、全局配置拉取、本地数据库初始化），这些逻辑的执行进度、最终结果需要被其他页面感知
• Splash后的路由跳转逻辑不再由Splash页面本身硬编码，而是要依赖全局状态值判断（比如已登录用户跳主页、未登录用户跳引导页）
• Splash加载过程需要展示和全局状态联动的UI（比如同步全局加载进度、展示初始化失败的全局重试入口）

1. 定义Splash对应的全局状态类 #

把Splash阶段需要管理的状态、业务逻辑都封装在独立的ChangeNotifier类中，和UI层解耦：

class SplashState extends ChangeNotifier {
  // 初始化状态相关参数
  double _loadProgress = 0;
  bool _isInitComplete = false;
  bool _isUserLoggedIn = false;
  String? _initErrorMessage;

  // 暴露只读的状态给UI层使用
  double get loadProgress => _loadProgress;
  bool get isInitComplete => _isInitComplete;
  bool get isUserLoggedIn => _isUserLoggedIn;
  String? get initErrorMessage => _initErrorMessage;

  // 执行Splash阶段的全部初始化逻辑
  Future<void> runInitProcess() async {
    try {
      // 第一步：初始化本地存储
      _loadProgress = 0.2;
      notifyListeners();
      await Future.delayed(const Duration(milliseconds: 200));

      // 第二步：校验本地存储的用户登录态
      _loadProgress = 0.6;
      notifyListeners();
      await Future.delayed(const Duration(milliseconds: 300));
      // 实际项目中这里替换为读取本地缓存、校验token的逻辑
      _isUserLoggedIn = true;

      // 第三步：完成初始化
      _loadProgress = 1.0;
      _isInitComplete = true;
      notifyListeners();
    } catch (e) {
      _initErrorMessage = e.toString();
      notifyListeners();
    }
  }
}

2. 应用根节点注入Provider #

在APP启动的入口文件中，把SplashState注册到全局Provider树中，保证Splash页面可以正常访问到状态实例：

void main() {
  runApp(
    MultiProvider(
      providers: [
        ChangeNotifierProvider(create: (context) => SplashState()),
        // 其他全局状态Provider按需添加
      ],
      child: const MyApp(),
    ),
  );
}

3. 构建SplashScreen页面，监听状态完成逻辑流转 #

在Splash组件的生命周期中触发初始化方法，通过context.watch监听状态变化，动态更新UI、触发路由跳转：

class SplashScreen extends StatefulWidget {
  const SplashScreen({super.key});

  @override
  State<SplashScreen> createState() => _SplashScreenState();
}

class _SplashScreenState extends State<SplashScreen> {
  @override
  void initState() {
    super.initState();
    // 页面挂载后触发初始化流程，只执行一次
    Future.microtask(() {
      Provider.of<SplashState>(context, listen: false).runInitProcess();
    });
  }

  @override
  Widget build(BuildContext context) {
    // 监听Splash状态变化，状态变更时自动重建UI
    final splashState = context.watch<SplashState>();

    // 帧渲染完成后执行路由跳转，避免直接在build阶段操作路由触发框架错误
    WidgetsBinding.instance.addPostFrameCallback((_) {
      // 初始化完成后根据登录态跳转对应页面
      if (splashState.isInitComplete) {
        Navigator.pushReplacement(
          context,
          MaterialPageRoute(
            builder: (context) => splashState.isUserLoggedIn 
              ? const HomePage() 
              : const LoginPage(),
          ),
        );
        return;
      }

      // 初始化失败时展示错误提示
      if (splashState.initErrorMessage != null) {
        ScaffoldMessenger.of(context).showSnackBar(
          SnackBar(content: Text('应用初始化失败: ${splashState.initErrorMessage}')),
        );
      }
    });

    return Scaffold(
      body: Center(
        child: Column(
          mainAxisSize: MainAxisSize.min,
          children: [
            // 自定义启动页Logo
            const FlutterLogo(size: 120),
            const SizedBox(height: 32),
            // 根据状态展示实时加载进度
            LinearProgressIndicator(
              value: splashState.loadProgress,
              minHeight: 4,
            ),
            const SizedBox(height: 16),
            const Text('正在准备应用资源...'),
          ],
        ),
      ),
    );
  }
}

• 不要硬套Provider：如果Splash阶段的状态只在当前页面内部使用、不需要共享给其他页面，把逻辑写在Splash组件的State里就足够，没必要强行提升到全局Provider增加冗余层级
• 路由跳转必须放在帧回调中执行：build方法是框架渲染的核心流程，直接在build阶段触发路由跳转、状态修改会触发setState during build类的框架报错
• 状态变更要和业务逻辑绑定：所有修改Provider状态的操作都要封装在State类的业务方法中，不要在UI组件里直接修改状态值，避免出现状态不可追溯、重建死循环的问题

内容的提问来源于stack exchange，提问作者Aju Alex