MobX

https://cn.mobx.js.org/

背后使用了 getter/setter 或者 Proxy，autorun 中使用的观察的数据，当更新时会自动执行： // ?

• https://codesandbox.io/s/z3lzx4q114 // autorun 中使用了新值时再次执行
• https://github.com/sorrycc/blog/issues/3 // 执行 autorun 中的函数以建立 Derivation 和 Observable 的联系

MobX背后的哲学很简单: 任何源自应用状态的东西都应该自动地获得。

React 和 MobX 是一对强力组合。React 通过提供机制把应用状态转换为可渲染组件树并对其进行渲染。而 MobX 提供机制来存储和更新应用状态供 React 使用。

MobX 提供了优化应用状态与 React 组件同步的机制，这种机制就是使用响应式虚拟依赖状态图表，它只有在真正需要的时候才更新并且永远保持是最新的。

Observable state(可观察的状态)

MobX 为现有的数据结构(如对象，数组和类实例)添加了可观察的功能

Computed values(计算值)

使用 MobX，你可以定义在相关数据发生变化时自动更新的值

Reactions(反应)

Reactions 和计算值很像，但它不是产生一个新的值，而是会产生一些副作用，比如打印到控制台、网络请求、递增地更新 React 组件树以修补DOM、等等。 简而言之，reactions 在 响应式编程和命令式编程之间建立沟通的桥梁。

Actions(动作)（可选概念）

• 可以用类似 Flux 的方式完成
• 或者使用 RxJS 来处理事件
• 或者用最直观、最简单的方式来处理事件，正如上面演示所用的 onClick

将无状态函数组件变成响应式组件