es.davy.ai

Preguntas y respuestas de programación confiables

¿Tienes una pregunta?

Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.

¿Cómo puedo pasar argumentos al método de consulta en Apollo?

Estoy usando el cliente Apollo para obtener los datos.
Y quiero que solo obtenga las tareas pendientes que son creadas por el usuario registrado.

Pero esta parte no funciona

Código fuente:

import { gql } from '@apollo/client';

export const todoService = {
    getTodoItems: () => gql`
    query todoQuery($loggedUserId: String!) {
        todo(where: { userId: { _eq: $loggedUserId } }, order_by: { createdAt: desc }) {
            id
            todo {
                title,
                body,
                status
            }
            userId
        }
    }`
}

Archivo “thunk” de Redux:

import { createAsyncThunk } from '@reduxjs/toolkit';
import { apolloClient } from '@/Apollo';
import { todoService } from './_graphql';

export const todoThunk = {
    getTodoItems: createAsyncThunk('db/getTodoItems', async (loggedUserId: string) => {
        const response = await apolloClient.query({
            query: todoService.getTodoItems(),
            variables: { loggedUserId },
            fetchPolicy: 'network-only',
        });
        return response;
    }),
}

Componente de React:

useEffect(
    dispatch(todoThunk.getTodoItems(loggedUserId));
,[dispatch])

Sin embargo, funciona cuando codifico el identificador del usuario en lugar de la variable “loggedUserId” como esto:

export const todoService = {
    getTodoItems: () => gql`
    query todoQuery {
        todo(where: { userId: { _eq: "some_hard_coded_id" } }, order_by: { createdAt: desc }) {
            id
            todo {
                title,
                body,
                status
            }
            userId
        }
    }`
}
Tags:  , , , ,

Answer

  1. Avatar for davy.ai

    Parece que la variable loggedUserId no está siendo pasada a la consulta.

    El problema parece estar en la forma en la que estás pasando la variable loggedUserId a la consulta. Necesitas pasarla como un parámetro a la consulta de esta manera:

    export const todoService = {
    getTodoItems: (loggedUserId: string) => gql`
        query todoQuery($loggedUserId: String!) {
          todo(where: { userId: { _eq: $loggedUserId } }, order_by: { createdAt: desc }) {
            id
            todo {
                title,
                body,
                status
            }
            userId
          }
        }
    }
    `
    

    Y luego pasarla como una variable al apolloClient.query de esta manera:

    export const todoThunk = {
    getTodoItems: createAsyncThunk(`db/getTodoItems`, async (loggedUserId: string) => {
        const response = await apolloClient.query({
          query: todoService.getTodoItems(loggedUserId),
          variables: { loggedUserId },
          fetchPolicy: `network-only`,
        });
        return response;
      }),
    

Comments are closed.