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

问题描述

当我将 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);
        }
      }
    },}
}
},});

这是房间

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

这是K3房间，有16条留言

解决方法

它是关于 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);
    }
  }
},}
}
},});