Tengo dos componentes TaskList que usan la misma consulta GET_TASKS .
Ambos usan una variable de consulta de filter diferente que se les transmite en accesorios como queryVars .
Definí una función de combinación estándar en las políticas de tipo para combinar los datos entrantes y existentes.
El componente TaskList utiliza
const { data, fetchMore } = useQuery<Response, Variables>(GET_TASKS, { variables: queryVars })para recuperar los datos.
Un botón Fetch more tiene () => fetchMore({ variables: queryVars }) en el atributo onClick .
Cuando hago clic en el botón Fetch more a la izquierda, las tareas a la derecha también se actualizan, sin embargo, sin aplicar su filtro, por lo que los datos que vienen con el filtro Asignado a mí también se colocan en la lista de tareas Asignado por mí y viceversa.
La función de combinación básicamente reescribe cada objeto de datos que utiliza la consulta dada.
¿Cómo le digo a Apollo que solo actualice los datos que están vinculados al componente donde se define fetchMore ?
Debería poder agregar un filtro a la propiedad keyArgs. Esto debería crear diferentes resultados de caché según el filtro.
const cache = new InMemoryCache({ typePolicies: { Query: { fields: { tasks: { keyArgs: ["filter"], merge(existing, incoming, { args: { offset = 0 }}) { //Custom merge }, }, }, }, }, });