Как передавать переменные в GraphQL запрос в компонентах React?

Добрый день. У меня есть компонент Продукта, который получает id элемента из другого компонента. Мне необходимо передать этот id в запрос к GraphQL и, соответственно, получить информацию об этом товаре.

Вот код запроса в Queries.js:
import {gql} from '@apollo/client';

export const CHOOSE_PRODUCT = gql`
    query{
        product(id:"huarache-x-stussy-le"){
            name
            description
        }
    }
`


И вот так передаю его в Product.js:
import { useQuery} from "@apollo/client"
import {CHOOSE_PRODUCT} from "../graphql/Queries"

export default function Product(){

    const {data} = useQuery(CHOOSE_PRODUCT)

    if(data){
        console.log(data)
    }


Я пробовал некоторые варианты передачи значения, но пока ничего не получилось. Как решить?
  • Вопрос задан
  • 38 просмотров
Пригласить эксперта
Ответы на вопрос 2
@HealSpirit
import { gql } from "@apollo/client";

export const getChooseProductQuery = (id) => gql`
  query {
    product(id: ${id}) {
      name
      description
    }
  }
`;


import { useQuery } from "@apollo/client";
import { getChooseProductQuery  } from "../graphql/Queries";

export default function Product(props) {
  const { id } = props;
  const { data } = useQuery(getChooseProductQuery(id));

  if (data) {
    console.log(data);
  }
}


Так не пойдет?
Ответ написан
Комментировать
@Doktorjd Автор вопроса
Нет, не получилось.
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы