Flutter状态管理之Redux

当你开发flutter到一定阶段的时候你就会发现，在这个一切皆组件的项目中，同时也会是一切皆状态，好几十个状态满天飞是少不了，所以我们在开发之初就应该好好思考下如何进行好这个状态管理，然而状态管理也就那么几种方案，之前的文章有提及到bloc这个状态管理，下面我就示例下另一种状态管理方式——redux*

redux的概念（react过来的朋友可以忽略）
redux最早是应用在react native开发中，它是基于 Flux 理念实现的一个响应式框架的状态管理方式，是一种单向数据流架构。
要想详细了解redux的概念兄弟姐妹们可以移步

[Flutter状态管理探索]（https://www.jianshu.com/p/5d7e2dbdaea5）
下面直接来个示例方面大家理解
redux管理用户状态示例

首先导入第三方框架

flutter_redux: ^0.5.3

创建 Reducer全局

import 'package:ydcflutter_app/me/bean/User.dart';
import 'package:ydcflutter_app/redux/user_redux.dart';
///全局Redux store 的对象，保存State数据
class MyState {
  ///用户信息
  User user;

  ///构造方法
  MyState({this.user});
}
///创建 Reducer
///源码中 Reducer 是一个方法 typedef State Reducer<State>(State state, dynamic action);
///我们自定义了 appReducer 用于创建 store
MyState appReducer(MyState state, action) {
  return MyState(
    ///通过自定义 UserReducer 将 MyState 内的 userInfo 和 action 关联在一起
    user: UserReducer(state.user, action),

  );
}
 
 

在这里初始化

  /// 创建Store，引用 YDCState 中的 appReducer 创建 Reducer
  /// initialState 初始化 State
  final store = new Store<MyState>(
      appReducer,
      initialState: new MyState(
        user: User.empty(),
      ));

使用示例

  @override
  Widget build(BuildContext context) {
    //使用 StoreBuilder 获取 store 中的state数据
    return  new StoreBuilder<MyState>(
            builder: (context, store) {
              return new Scaffold(
                  body: Center(
                      child: Builder(builder: (context) {
                        return Column(
                            mainAxisAlignment: MainAxisAlignment.center,
                            children: <Widget>[
                              Builder(builder: (context) {
                                return Text("使用Redux更新数据: ${store.state.user.name??"---"}");
                              }),
                              new Padding(
                                  padding: const EdgeInsets.only(top: 15.0),
                                  child:
                                  new FloatingActionButton(
                                    onPressed: (){
                                      var newUserInfo=User("把用户名字更新为无用");
                                      store.dispatch(new UpdateUserAction(newUserInfo));
                                    },
                                    child: Icon(Icons.add),
                                  )
                              )
                            ]
                        );

                      }))
              );
            });
  }

好了跟着前面的文章跟着思路慢慢深入理解就ok了，源码后续提供