用户登录

Store 里的 Observable 发生了变化,你可以设计一些 Reaction,也就是反应,可以在指定的 Observable 发生变化的时候,再去做一些额外的事情。

autorun

在这个 AppStore 里面,可以先定义一个方法,方法的名字随便起,比如 initReactions,在这个方法里可以设计一些 Reaction,添加反应有几种方法,比如可以使用 autorun 这个方法,给它提供一个方法参数,在这个方法参数里用到的 Observable 发生变化的时候就会执行这个方法。

比如这里用 print 输出一行文字,autorun - loading: 后面加上 $loading,这里用了 loading 这个 Observable,所以如果它有变化,就会执行给这个 autorun 提供的方法。

下面我们要找个地方安排一下要注册的反应,比如这里我们添加一个构造方法,_AppStore,在这个构造方法里面,执行一下 initReactions ,这样创建这个 AppStore 实例的时候,就会执行 initReactions,在它里面用了 autorun 设计安排了一个反应。这个反应做的事情就是在一开始,或者 loading 这个 Observable 有变化的时候,在控制台上输出一行文字。

测试

打开编辑器的调试,重新启动一下。你会发现在控制台上会输出一行文字,autorun - loading: false。 按一下这个测试按钮,它会修改 loading 这个 Observable 的值, 我们之前设计过一种反应,就是在 loading 有变化的时候,在控制台上输出一行文字。

reaction

添加反应除了可以用这个 autorun,我们还可以使用 reaction 这个方法,第一个参数是个函数,这个函数返回的东西,就是这个反应监视的东西,这里可以让它返回 loading 这个 Observable。

然后再给这个 reaction 提供一个 effect,就是一个函数,也就是当 loading 这个 Observable 发生变化的时候,就会执行给这个 reaction 提供的 effect,在这个 effect 函数里面,接收一个 value 参数,它的值就是 Observable 变化之后的值。我们同样可以在控制台上输出一行文字,reaction - loading: 后面再加上这个 $value 的值。

测试

打开编辑器的调试,重新启动一下,按一下界面上的这个测试按钮,然后观察一下控制台输出的东西。因为 AppStore 里的 loading 这个 Observable 发生了变化,执行了设计好的反应以后,在控制台上就会输出一些东西。

使用 MobX 管理应用状态:添加反应(Reaction)《 Flutter 移动端实例:状态管理 》

统计

15260
分钟
0
你学会了
0%
完成

社会化网络

关于

微信订阅号

扫描微信二维码关注宁皓网,每天进步一点