flutter redux的理解

2020-10-12  本文已影响0人  only_run

redux是 flutter项目中的 状态管理解决方案
redux

关键角色

typedef State Reducer<State>(State state, dynamic action);

middleware 中间件,用来在 reducer 操作状态数据之前,拦截action;

typedef void Middleware<State>(Store<State> store,dynamic action,NextDispatcher next,
);

Store详解

 Store(
    this.reducer, {
    State initialState,
    List<Middleware<State>> middleware = const [],
    bool syncStream: false,

    /// If set to true, the Store will not emit onChange events if the new State
    /// that is returned from your [reducer] in response to an Action is equal
    /// to the previous state.
    ///
    /// Under the hood, it will use the `==` method from your State class to
    /// determine whether or not the two States are equal.
    bool distinct: false,
  })
      : _changeController = new StreamController.broadcast(sync: syncStream) {
    _state = initialState;
    _dispatchers = _createDispatchers(
      middleware,
      _createReduceAndNotify(distinct),
    );
  }

Store创建对象时,可指定Reducer,状态数据,和多个中间件;
并在构造方法中 创建一个StreamController _changeController ,mark一下 后面会有关联使用;
对middleware中间件 进行了包装 成为NextDispatcher;

typedef void NextDispatcher(dynamic action);

StoreProvider详解

 const StoreProvider({
    Key key,
    @required Store<S> store,
    @required Widget child,
  }) 

 static Store<S> of<S>(BuildContext context, {bool listen = true}) {
  ...
 }

StoreProvider 创建是需要指定一个 store对象;
StoreProvider 有一个 静态函数 StoreProvider.of() 获取 祖先或者当前widget的 store;
StoreProvider 是 InheritedWidget的子类;

StoreBuilder,StoreConnector详解

StoreBuilder是 对StoreConnector的封装;
StoreConnector 本质是一个 widget,只不过 build函数 使用了 StreamBuilder;
Store对象 通过StoreProvider.of<S>(context)获取,没错就是StoreProvider类的静态函数;
而stream 对象就是 Store对象持有的 数据流观察者,来接收store数据变化 并通过StreamBuilder 重新build;

@override
  Widget build(BuildContext context) {
    return widget.rebuildOnChange
        ? StreamBuilder<ViewModel>(
            stream: stream,
            builder: (context, snapshot) => widget.builder(
              context,
              latestValue,
            ),
          )
        : widget.builder(context, latestValue);
  }

action的发出和处理

Store 有一个发送action的函数 dispatch;

void dispatch(dynamic action) {
    _dispatchers[0](action);
  }

action 的处理是由 NextDispatcher包装的 Middleware完成的;而且最后一个 NextDispatcher包装的 Middleware中间件 是固定的(redux框架 指定的),用来 更新 数据状态 和通知widget更新。
固定的中间件:

 NextDispatcher _createReduceAndNotify(bool distinct) {
    return (dynamic action) {
      final state = reducer(_state, action);

      if (distinct && state == _state) return;

      _state = state;
      _changeController.add(state);
    };
  }

业务widget接收更新

业务widget 即:StoreBuilder StoreConnector;在build函数中 通过 StreamBuilder 的stream接收 数据状态的变化,并重新build。

上一篇下一篇

猜你喜欢

热点阅读