维护与数据库同步的 MobX 对象

Question

我在我的 React 应用中使用 MobX 来管理我的全局状态。基本上，我正在镜像后端数据（关系数据库）的结构并根据需要获取数据。

目前我有以下结构：

class Model {
    @observable id
    @observable propA = 0

    constructor(doc) {
        this.id = doc.id
        this.propA = doc.propA
    }

    @action
    update = (doc) => {
        this.propA = doc.propA
    }

    @computed
    get computedProp() {
        return this.propA * 2
    }
}

class Store {
    records = observable.map()

    @action
    fetchOne = async (id) => {
        const doc = await fetch(url + id)
        const model = new Model(doc)
        this.records.set(id, model)
    }

    getOne = copmutedFn((id) => {
        if (!this.records.has(id)) {
            this.fetchOne(id)
        }

        return this.records.get(id)
    })
}

computedFn 函数来自 mobx-utils，基本上是一个接受参数的计算函数。

我将所有记录保存在 store records 属性中，以维护应用程序不同部分之间的引用。

我现在要做的是将这些记录与我的数据库保持同步，并且我计划使用固定间隔轮询方法来做到这一点。

但是我不想重新获取我存储的每条记录，有些记录可能不再被观察到，我只想获取应用程序当前需要的记录。

有没有办法让我查看，例如，records 属性并检查哪些 id 正在被观察，哪些没有？

是否有其他结构可以在不侵入 MobX 内部的情况下实现更精细的控制？

Answer 1

您可以尝试使用mobx atoms，基本上它是一种创建自己的数据结构的方法。

它有两个可以使用的回调：onBecomeObserved 和 onBecomeUnobserved。当某些事情开始和停止观察您的数据结构时，他们会通知您。