在Flutter中,除了BLoC以外,还有一些其他的状态管理解决方案。以下是几种常见的不使用BLoC的Flutter状态管理解决方法。
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
class Counter with ChangeNotifier {
int _count = 0;
int get count => _count;
void increment() {
_count++;
notifyListeners(); // 通知监听者刷新UI
}
}
void main() {
runApp(
ChangeNotifierProvider(
create: (_) => Counter(),
child: MyApp(),
),
);
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(
title: Text('Flutter State Management'),
),
body: Center(
child: Consumer(
builder: (context, counter, _) => Text(
'Count: ${counter.count}',
style: TextStyle(fontSize: 24),
),
),
),
floatingActionButton: FloatingActionButton(
onPressed: () {
Provider.of(context, listen: false).increment();
},
child: Icon(Icons.add),
),
),
);
}
}
import 'package:flutter/material.dart';
import 'package:flutter_mobx/flutter_mobx.dart';
import 'package:mobx/mobx.dart';
part 'counter.g.dart';
class Counter = _Counter with _$Counter;
abstract class _Counter with Store {
@observable
int count = 0;
@action
void increment() {
count++;
}
}
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
final counter = Counter();
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(
title: Text('Flutter State Management'),
),
body: Center(
child: Observer(
builder: (context) => Text(
'Count: ${counter.count}',
style: TextStyle(fontSize: 24),
),
),
),
floatingActionButton: FloatingActionButton(
onPressed: () {
counter.increment();
},
child: Icon(Icons.add),
),
),
);
}
}
import 'package:flutter/material.dart';
import 'package:flutter_redux/flutter_redux.dart';
import 'package:redux/redux.dart';
// 定义Action
enum CountAction { increment }
// 定义Reducer
int countReducer(int state, dynamic action) {
if (action == CountAction.increment) {
return state + 1;
}
return state;
}
void main() {
final store =
Store(countReducer, initialState: 0); // 创建Store并指定Reducer和初始状态
runApp(MyApp(store: store));
}
class MyApp extends StatelessWidget {
final Store store;
MyApp({required this.store});
@override
Widget build(BuildContext context) {
return StoreProvider(
store: store,
child: MaterialApp(
home: Scaffold(
appBar: AppBar(
title: Text('Flutter State Management'),
),
body: Center(
child: StoreConnector(
converter: (store) => store.state,
builder: (context, count) => Text(
'Count: $count',
style: TextStyle(fontSize: 24),
),
),
),
floatingActionButton: StoreConnector(
converter: (store) {
return () => store.dispatch(CountAction.increment);
},
builder: (context, callback) => FloatingActionButton(
onPressed: callback,
child: Icon(Icons.add),
),
),
),
),
);
}
}
这些是几种不使用BLoC的Flutter状态管理解决方案,你可以