一、创建全局state

1// state.dart
2import 'package:nicolas/redux/user/login_redux.dart';
3import 'package:nicolas/redux/user/user_redux.dart';
4import 'package:nicolas/redux/middleware/epic_middleware.dart'; // 在项目中引入epic_middleware中间件
5import 'package:redux/redux.dart';
6
7class GlobalState { // 全局Redux对象，保存State数据
8  bool login; // 登陆状态
9
10  GlobalState({this.login});
11}
12// 定义appReducer创建 store，通过 appReducer 将 GlobalState 内的login 和 对应的action 关联在一起
13GlobalState appReducer(GlobalState state, action) {
14  return GlobalState(
15    login: loginReducer(state.login, action),
16  );
17}
18
19final List<Middleware<GlobalState>> middleware = [
20  EpicMiddleware<GlobalState>(LoginEpic()),
21  LoginMiddleware(),
22];

二、创建login的state管理

1import 'package:flutter/material.dart';
2import 'package:nicolas/redux/state.dart';
3import 'package:nicolas/redux/middleware/epic.dart';
4import 'package:nicolas/redux/middleware/epic_store.dart';
5import 'package:redux/redux.dart';
6
7final loginReducer = combineReducers<bool>([
8  TypedReducer<bool, LoginSuccessAction>(_loginResult),
9  TypedReducer<bool, LogoutAction>(_logoutResult),
10]);
11
12bool _loginResult(bool result, LoginSuccessAction action) {
13  if (action.success == true) {
14    // 登陆成功以后....
15  }
16  return action.success;
17}
18
19// LoginSuccessAction触发，就会调用到 _loginResult，它接受一个新的state，并返回
20class LoginSuccessAction {
21  final BuildContext context;
22  final bool success;
23
24  LoginSuccessAction(this.context, this.success);
25}
26
27class LoginAction {
28  final BuildContext context;
29  final String user;
30  final String password;
31
32  LoginAction(this.context, this.user, this.password);
33}
34
35class LoginMiddleware implements MiddlewareClass<GlobalState> {
36  @override
37  void call(Store<GlobalState> store, dynamic action, NextDispatcher next) {
38    if (action is LogoutAction) {
39      print('logout');
40    }
41    // Make sure to forward actions to the next middleware in the chain!
42    next(action);
43  }
44}
45
46class LoginEpic implements EpicClass<GlobalState> {
47  @override
48  Stream<dynamic> call(Stream<dynamic> actions, EpicStore<GlobalState> store) {
49    return Observable(actions)
50        .whereType<LoginAction>()
51        .switchMap((action) => _loginIn(action, store));
52  }
53
54  Stream<dynamic> _loginIn(
55      LoginAction action, EpicStore<GlobalState> store) async* {
56    var res = await UserDio.login( // 登陆请求
57        action.user.trim(), action.password.trim(), store);
58    yield LoginSuccessAction(action.context, (res != null && res.result)); // 登陆请求结果处理
59  }
60}
61

三、注册全局state

1import 'dart:async';
2
3import 'package:flutter/material.dart';
4import 'package:nicolas/redux/state.dart';
5import 'package:nicolas/app.dart';
6import 'package:nicolas/page/user/login.dart';
7import 'package:flutter_redux/flutter_redux.dart';
8import 'package:nicolas/common/utils/navigator.dart';
9import 'package:fluttertoast/fluttertoast.dart';
10import 'package:redux/redux.dart';
11import 'common/event/index.dart';
12import 'package:nicolas/common/event/http_error_event.dart';
13import 'package:nicolas/common/http/code.dart';
14
15void main() => runApp(FlutterReduxApp());
16
17class FlutterReduxApp extends StatefulWidget {
18  @override
19  _FlutterReduxAppState createState() => _FlutterReduxAppState();
20}
21
22class _FlutterReduxAppState extends State<FlutterReduxApp>
23    with HttpErrorListener {
24  final store = new Store<GlobalState>(appReducer,
25      middleware: middleware,
26      initialState: new GlobalState( // 初始化state数据
27        login: false,
28      ));
29
30  @override
31  Widget build(BuildContext context) {
32    return new StoreProvider(
33      store: store, // 挂载store
34      child: new StoreBuilder<GlobalState>(builder: (context, store) {
35        return Text('xxxx);
36      }),
37    );
38  }
39}
40

四、使用state

1Container(
2    child: new StoreConnector<GlobalState, bool>(
3        converter: (store) => store.state.login,
4        builder: (context, login) {
5            return Text(login.toString());
6        },
7    )
8);
9