mobx-state-tree中的异步加载参考数据

问题描述 投票:0回答:1

我浏览了mobx-state-tree文档甚至测试文件https://github.com/mobxjs/mobx-state-tree/blob/master/packages/mobx-state-tree/tests/core/reference-custom.test.ts#L148找出如何从异步源中填充参考节点。例如,已加载user1并引用了user2,但是user2不在树中,因此请获取user2并进行加载。过去,我很早就加载了所有用户,因此types.late()可以正常工作。但是我已经在加载时间开始时停止加载所有用户,而是只希望加载被引用的用户数据。

这是一个示例片段。我实际上并没有在沙箱中使用此示例,因为我正在寻找您的好帮手,他们在哪里以及如何异步获取丢失的节点背后的逻辑上为您提供指导。您会注意到,创建商店时正在加载的两个用户引用了尚未加载的第三个用户。当MST时,它用前两个用户填充树并遇到对卸载的用户ID的引用,我们如何使它获取用户,然后将其添加到用户地图?

export const User = types
      .model("User", {
        id: types.identifier,
        name: types.string,
        friends: types.array(types.late(types.reference(User)))
      })
      .preProcessSnapshot(snapshot => {
        if (snapshot){
            return({
              id: snapshot.id,
              name: snapshot.name,
              friends: snapshot.friends
            })
        }
      })

    export const UserStore = types
      .model("UserStore", {
        users: types.map(User),
      })
      .actions( self => ({
        fetchUser: flow(function* (userId) {
          let returnThis
          try {
            returnThis = yield ajaxFetchUser(userId) 
            self.users.put(returnThis)
          } catch (error) {
            console.log(error)
          }
          return self.users.get(returnThis.id)
        })
      }))

    UserStore.create({
      users:[{
        id: 1,
        name: "Justin",
        friends: ["2","3"]
      },{
        id: 2,
        name: "Jack",
        friends: ["1","3"]
      }]
    })

    const ajaxFetchUser = (userId) => {
      // pretend that userId is 3
      setTimeout(()=>{
        return {
          id:3,
          name: "John",
          friends: ["1","2"]
        }
      }, 3000)
    }

当然,我使用的脚本比此代码复杂得多,具有适当的map.put和map.get操作。

[如果有人可以对此问题有所了解,我非常有义务。

mobx mobx-state-tree
1个回答
0
投票

您可以尝试通过将某人变成一个吸气剂(基本上是一个视图)并从那里安排一个动作(获取数据)来拦截试图访问该特定属性的人(以您的情况为参考)。我知道您似乎在侵犯那里的东西(您确实),但这就是您所追求的。我认为MobX无论如何都是在幕后运作,也许事实是它违反了最佳实践,这促使其作者改用代理。嗯...您可能也想尝试Proxy

© www.soinside.com 2019 - 2024. All rights reserved.