14、MobX 实用工具与内部原理深度解析

MobX 实用工具与内部原理深度解析

1. MobX-State-Tree 实用特性

1.1 不可变快照（Immutable snapshots）

MST 会在内存中始终保留状态树的不可变版本，可通过 getSnapshot() API 来获取。例如：

const snapshot = getSnapshot(tree);

这与使用快照创建树的操作相反：

const tree = Type.create(snapshot);

getSnapshot() 能方便地快速序列化整个树的状态。由于 MST 由 MobX 驱动，我们也能很好地跟踪这些状态。快照对应模型实例上的计算属性。

下面的代码片段会在树的状态每次改变时，自动将其存储到本地存储中，但每秒最多存储一次：

import { reaction } from 'mobx';
import { getSnapshot } from 'mobx-state-tree';
const app = App.create(/* as before */);
reaction(
    () => getSnapshot(app),
    snapshot => {
        window.localStorage.setItem