为聊天应用程序缓存 apollo 客户端的最佳方式是什么？答案

【问题标题】：What is the best way caching apollo client for chat applications?为聊天应用程序缓存 apollo 客户端的最佳方式是什么？
【发布时间】：2021-09-24 14:09:21
【问题描述】：

当我为聊天应用程序使用 apollo 客户端缓存时，出现逻辑错误。

例如，我去第一个房间缓存显示 10 条消息，当我这次单击另一个房间时，我收到最后访问房间的消息？ 我的缓存

const cache = new InMemoryCache({
typePolicies: {
Query: {
  fields: {
    lastRooms: offsetLimitPagination(),
    lastTopics: offsetLimitPagination(),
    topicDetail: offsetLimitPagination(),
    // chatDetail: offsetLimitPagination(),
    chatDetail: {
      keyArgs:['limit'],
      merge(existing=[], incoming=[], { readField }) {
        try {
          let merged = existing 
          const existingIdSet = new Set(merged.map(message => readField("_id", message)));
          if (incoming) {
            incoming = incoming.filter(message => !existingIdSet.has(readField("_id", message)))
          }
          return [...merged, ...incoming]
        } catch (error) {
          console.log("Apollo Cache chatDetail Query fields Erorr:", error);
        }
      }
    }, 
  }
}
},
});

这是房间

这是第一个房间，只有 2 条消息

这是K3房间，有16条消息

【问题讨论】：

标签： react-native caching graphql apollo-client apollo-cache-inmemory

【解决方案1】：

关于 keyArgs 字段。 keyArgs 字段必须是你要缓存的数据，你应该设置 keyArgs 字段为那个

例如，如果您的查询参数是 (room, user, ...) 您应该使用 keyArgs:["room"] 缓存的使用应该和 roomDetail 一样：

const cache = new InMemoryCache({
typePolicies: {
Query: {
fields: {
lastRooms: offsetLimitPagination(),
lastTopics: offsetLimitPagination(),
topicDetail: offsetLimitPagination(),
chatDetail: {
  keyArgs:['room'],
  merge(existing=[], incoming=[], { readField }) {
    try {
      let merged = existing 
      const existingIdSet = new Set(merged.map(message => readField("_id", message)));
      if (incoming) {
        incoming = incoming.filter(message => !existingIdSet.has(readField("_id", message)))
      }
      return [...merged, ...incoming]
    } catch (error) {
      console.log("Apollo Cache chatDetail Query fields Erorr:", error);
    }
  }
}, 
}
}
},
});

【讨论】：