引言
状态管理是 Flutter 开发中最核心、也最容易引发争议的话题。初学者常陷入"该用哪种状态管理"的焦虑,而资深开发者则在"过度设计"与"可维护性"之间反复权衡。
本文将带你系统梳理 Flutter 状态管理演进史 ,从最原始的 setState,到官方推荐的 Provider,再到社区爆款 Riverpod 2.0,并通过 真实业务场景对比,帮助你做出理性技术选型。全文包含大量可运行代码、架构图与性能分析,助你构建可扩展、易测试、高性能的 Flutter 应用。
一、为什么需要状态管理?
1.1 什么是"状态"?
- 状态 = 应用在某一时刻的数据快照。
- 包括:用户输入、网络响应、主题配置、路由栈等。
1.2 状态管理的核心挑战
❌ 反面教材:全局变量 + setState → 无法追踪变更、难以测试、易出错。
二、setState:起点,但不是终点
2.1 基本用法
Dart
1class CounterPage extends StatefulWidget {
2 @override
3 _CounterPageState createState() => _CounterPageState();
4}
5
6class _CounterPageState extends State<CounterPage> {
7 int count = 0;
8
9 void _increment() {
10 setState(() {
11 count++;
12 });
13 }
14
15 @override
16 Widget build(BuildContext context) {
17 return Scaffold(
18 body: Text('$count'),
19 floatingActionButton: FloatingActionButton(onPressed: _increment),
20 );
21 }
22}
2.2 局限性
✅ 适用场景:表单输入、简单计数器、Dialog 状态。
三、InheritedWidget:Flutter 的底层通信机制
3.1 原理
3.2 手动实现状态共享(不推荐生产使用)
Dart
1class AppState extends InheritedWidget {
2 final int count;
3 final VoidCallback increment;
4
5 AppState({required this.count, required this.increment, required Widget child})
6 : super(child: child);
7
8 static AppState? of(BuildContext context) {
9 return context.dependOnInheritedWidgetOfExactType<AppState>();
10 }
11
12 @override
13 bool updateShouldNotify(AppState oldWidget) => count != oldWidget.count;
14}
🔍 洞察:Provider、Riverpod 本质都是对 InheritedWidget 的封装。
四、Provider:官方推荐的轻量级方案
4.1 核心概念
4.2 多 Provider 组合
Dart
1MultiProvider(
2 providers: [
3 ChangeNotifierProvider(create: (_) => AuthModel()),
4 Provider(create: (_) => ApiService()),
5 FutureProvider(create: (_) => Database.init()),
6 ],
7 child: MyApp(),
8)
4.3 ProxyProvider:依赖注入
Dart
1ProxyProvider<AuthModel, UserRepository>(
2 update: (_, auth, __) => UserRepository(auth.token),
3)
4.4 性能陷阱与规避
五、Riverpod 2.0:现代化状态管理的标杆
5.1 为什么选择 Riverpod?
5.2 核心 API 演示
5.2.1 Provider(只读)
Dart
1final configProvider = Provider<Config>((ref) {
2 return Config(apiUrl: 'https://api.example.com');
3});
5.2.2 StateProvider(简单可变状态)
Dart
1final themeModeProvider = StateProvider<ThemeMode>((ref) => ThemeMode.light);
5.2.3 StateNotifierProvider(复杂逻辑)
Dart
1class CartNotifier extends StateNotifier<Cart> {
2 CartNotifier() : super(Cart(items: []));
3
4 void addItem(Product product) {
5 state = Cart(items: [...state.items, product]);
6 }
7}
8
9final cartProvider = StateNotifierProvider<CartNotifier, Cart>((ref) {
10 return CartNotifier();
11});
5.2.4 FutureProvider / StreamProvider
Dart
1final userProvider = FutureProvider<User>((ref) async {
2 final api = ref.read(apiProvider);
3 return api.fetchUser();
4});
5.3 Family:参数化 Provider
Dart
1final postProvider = FutureProvider.family<Post, int>((ref, postId) async {
2 return await api.getPost(postId);
3});
4
5// 使用
6ref.watch(postProvider(123));
5.4 AsyncValue:优雅处理加载状态
Dart
1Widget build(BuildContext context, WidgetRef ref) {
2 final AsyncValue<User> userAsync = ref.watch(userProvider);
3
4 return userAsync.when(
5 loading: () => CircularProgressIndicator(),
6 error: (err, stack) => Text('Error: $err'),
7 data: (user) => Text('Hello ${user.name}'),
8 );
9}
六、Bloc / Cubit:面向事件的状态管理
6.1 核心思想
6.2 Cubit 示例
Dart
1class CounterCubit extends Cubit<int> {
2 CounterCubit() : super(0);
3
4 void increment() => emit(state + 1);
5}
6
7// 使用
8BlocProvider(
9 create: (_) => CounterCubit(),
10 child: CounterPage(),
11)
12
13BlocBuilder<CounterCubit, int>(
14 builder: (context, count) => Text('$count'),
15)
6.3 适用场景
七、GetX:争议中的高效方案
7.1 三大核心
7.2 简单示例
Dart
1class Controller extends GetxController {
2 var count = 0.obs;
3 void increment() => count++;
4}
5
6// 初始化
7Get.put(Controller());
8
9// 使用
10Obx(() => Text('${Get.find<Controller>().count}'))
7.3 争议点
✅ 适合:快速原型、小型项目、个人开发者。
八、技术选型决策树

结语
状态管理没有银弹,只有最适合当前项目的方案。本文系统对比了主流方案的原理、优劣与适用场景,希望你能根据团队规模、项目复杂度、长期维护成本做出明智选择。记住:简洁、可读、可测,才是优秀架构的核心标准。
欢迎大家加入[开源鸿蒙跨平台开发者社区](https://openharmonycrossplatform.csdn.net),一起共建开源鸿蒙跨平台生态。