1分钟
06 flutter_redux-2
如下图所示,是 flutter_redux
从入口到更新的完整流程图,整理这个流程其中最关键有几个点是:
StoreProvider
是InheritedWidgets
,所以它可以通过context
实现状态共享。StreamBuilder
/StoreConnector
的内部实现主要是StreamBuilder
。Store
内部是通过StreamController.broadcast
创建的Stream
,然后在StoreConnector
中通过Stream
的map
、transform
实现小状态的变换,最后更新到StreamBuilder
。
那么现在看下图流程有点晕?下面我们直接分析图中流程。
可以看出整个流程的核心还是 Stream
,基于这几个关键点,我们把上图的流程整理为:
- 1、
Store
创建时传入reducer
对象和middleware
数组,同时通过StreamController.broadcast
创建了_changeController
对象。 - 2、
Store
利用middleware
和_changeController
组成了一个NextDispatcher
方法数组 ,并把_changeController
所在的NextDispatcher
方法放置在数组最后位置。 - 3、
StoreConnector
内通过Store
的_changeController
获取Stream
,并进行了一系列变换后,最终Stream
设置给了StreamBuilder
。 - 4、当我们调用
Stroe
的dispatch
方法时,我们会先进过NextDispatcher
数组中的一系列middleware
拦截器,最终调用到队末的_changeController
所在的NextDispatcher
。 - 5、最后一个
NextDispatcher
执行时会先执行reducer
方法获取新的state
,然后通过_changeController.add
将状态加载到Stream
流程中,触发StoreConnector
的StreamBuilder
更新数据。
如果对于
Stream
流程不熟悉的还请看上篇。
现在再对照流程图会不会清晰很多了?
在 flutter_redux
中,开发者的每个操作都只是一个 Action
,而这个行为所触发的逻辑完全由 middleware
和 reducer
决定,这样的设计在一定程度上将业务与UI隔离,同时也统一了状态的管理。
比如你一个点击行为只是发出一个
RefrshAction
,但是通过middleware
拦截之后,在其中异步处理完几个数据接口,然后重新dispatch
出Action1
、Action2
、Action3
去更新其他页面, 类似的redux_epics
库就是这样实现异步的middleware
逻辑。
学员评价