mobx 3.1.9
autorun
- autorun
- observable
- globalstate
- reaction
实现:
1 | var bankUser = mobx.observable({ |
可观察watcher
调用 mobx.observable()
方法,创建了 observable 对象, 对象的所有属性都拷贝至一个克隆对象并将克隆对象设置成 可观察 — 猜测使用的是es6的proxy方法
观察员watcher有两个非常重要的行为特征:
- 当有人请求观察员所监控的值(比如income)时,会触发 MobX 所提供的
reportObserved
方法; - 当观察员所监控的值(比如income)发生变化时,会触发 MobX 所提供的
propagateChanged
方法;
自动执行autorun
含义: 响应式函数 —— 响应观察值的变化而自动执行指定的函数。
脉络
创建
Reaction
类型对象,关键特征是 监督并控制任务的执行分配任务
立即执行一次autorun中的函数,通过reaction.schedule()
reaction.schedule
- 探长入列
- 让队列所有探长执行
runReaction
方法
探长是个啥玩意儿
主流程大致只有 4 步:
- 开始执行(runReaction)
- 判断是否执行(shouldCompute)
- 执行任务(onInvalidate)
- 结束
有一个很重要的 shouldCompute 判断方法步骤,根据这个方法探长可以自行判断 是否执行任务,并非所有的任务都需要执行,这一步的作用是优化 MobX 执行效率。
开始执行(runReaction)
为开始执行做准备工作
用 startBatch() 开头,用 endBatch() 结尾,中间隔着 onInvalidate。
startBatch() 和 endBatch() 这两个方法一定是成对出现,用于影响 globalState 的 inBatch 属性,表明开启/关闭 一层新的事务
执行任务(onInvalidate)
onInvalidate 是 Reaction 类的一个属性,且在初始化 Reaction 时传入到构造函数中的,这样做的目的是方便做扩展。
autorun 方法本质就是一种预定义好的 Reaction —— 你可以依葫芦画瓢,将自定义 onInvalidate 方法传给 Reaction 来实现自己的 计划任务